标签云

微信群

扫码加入我们

WeChat QR Code

This question already has an answer here:

What is the difference between the following lines of code?

//Function declaration
function foo() { return 5; }

//Anonymous function expression
var foo = function() { return 5; }

//Named function expression
var foo = function foo() { return 5; }
  • What is a named/anonymous function expression?
  • What is a declared function?
  • How do browsers deal with these constructs differently?

What do the responses to a similar question (var functionName = function() {} vs function functionName() {}) not get exactly right?


Here's a good article on named function expressions. Function expressions vs declarations are addressed in the first section.

2018年06月19日09分34秒

The main difference IMO is hoisting. Here is a good article on the topic: adequatelygood.com/JavaScript-Scoping-and-Hoisting.html

2018年06月19日09分34秒

The last one is not the same than var foo = function() { return 5; }. Because here, foo.name is '', in the last one it is 'foo'.

2018年06月19日09分34秒

JCM AFAIK, the name property is not part of ECMAScript and is only implemented in some browsers. Function.name at MDN

2018年06月19日09分34秒

ZachL Just used as example, what I wanted to say is that the second function has a name, where the first one doesn't.

2018年06月19日09分34秒

"But if you call a function declaration, it'll always work." So then is there ever a benefit of using a function expression? Why not just always use declarations?

2018年06月20日09分34秒

It's actually considered a best practice to use function expressions as then the behavior is more intuitive than with declarations. It reads better as it follows a logical flow, You define it and then call it, if you don't you get an error, which is the expected behavior. Actually I think function declarations are not allowed in non function scopes...I recommend this post on the subject: javascriptweblog.wordpress.com/2010/07/06/…

2018年06月19日09分34秒

Welcome to Stack Overflow! Thanks for posting your answer! Please be sure to read the FAQ on Self-Promotion carefully. Also note that it is required that you post a disclaimer every time you link to your own site/product.

2018年06月19日09分34秒

point of interest: js is case-sensitive. Your caps-locked examples don't work ;-)

2018年06月20日09分34秒

also, you can have a Named IIFE: (function myFunc() { ... }());

2018年06月20日09分34秒

ZachL Thx for correcting me. I've modified my answer.

2018年06月19日09分34秒

Shorter and widely used way to write IIFE: If you don't care about the return value, or the possibility of making your code slightly harder to read, you can save a byte by just prefixing the function with a unary operator. Example: !function(){ /*code*/ }(); (source: linked article)

2018年06月20日09分34秒

You don't need to declare the function with a different name to make it recursive. In fact, I'd say that confuses things. a = function a(i) and doing return a(++i) produces the same result

2018年06月19日09分34秒

But using a different name for the function than the variable illustrates the point more clearly. Kudos for providing an example for usage of named function expressions.

2018年06月19日09分34秒

fooYou is not ignored. It is visible in function body, so the function can reference itself (e.g. to implement recursion).

2018年06月20日09分34秒

That's a good point. I didn't think about that :)

2018年06月20日09分34秒

Also, named function expressions are useful for debugging: var foo = function fooYou() { return 5; }; console.log(foo); console.log(foo.name); will print fooYou() / fooYou (Firefox), [Function: fooYou] / fooYou (node.js), function fooYou() { return 5; } / fooYou (Chrome) or something alone these lines, depending on where you execute it.

2018年06月20日09分34秒

Named function expressions is the recommended practice since it allows you to refer the function internally, if you need. For instance, to call the function recursively or deal with its name or properties. The major benefit, by the way, is debugging. If you use unnamed functions it's hard to debug if something happen right there, since you will get a reference to an anonymous function and not its name

2018年06月19日09分34秒