var a = function(){return true;}
var a = function abc(){return true;}
Can anyone explain to me what the difference between these two are?
3 Answers
The difference here is that here
var a = function abc(){return true;}
You are naming an anonymous function. This name abc is available only for the internal scope of the function.
UPDATE
It is true though that some implementations don't respect the convention... don't expect IE8 to work with it...
1 Comment
Cu3PO42
At least that's the way it's supposed to be... some implementations screw this up however :(
Both of your examples are just function expressions — meaning that you're assigning an expression (which happens to be a function) to a variable. The difference is that one is anonymous, while the other is what's called a "named function expression". http://kangax.github.io/nfe/ has a great overview on what the differences between function declarations, expressions, and named expressions are. The short version:
- These things are, for the most part, interchangeable in many situations
- If you do a lot of debugging, having named instead of anonymous functions can make your call stack easier to read
- However, there exist bugs in certain JavaScript implementations involving the use of named function expressions
2 Comments
samanime
Just to add to your answer, I find for larger projects it is handy to name the function (the second line) for debug purposes (things like the Chrome console will show the name if there is an error), but then having a minifier/cleaner go through and strip the names for the production releases.
OverlappingElvis
Good point — nothing should be lost in minification by dropping the function names.
The second function is a named function expression. It may be useful for recursion, e.g.
// named
var a = function abc(v) { console.log(v); return v>1 && abc(v-1) || v;}
// ^ name abc is known
,b = a
a(3); //=> 3,2,1
b(4); //=> 4,3,2,1
a = function (v) {console.log('value = '+ v);};
b(3); //=> 3,2,1
// versus
var a = function (v) { console.log(v); return v>1 && a(v-1) || v;}
// ^ using a here
,b = a
a(3); //=> 3,2,1
b(4); //=> 4,3,2,1
a = function (v) {console.log('value = '+ v);};
b(3); //=> 'value = 3'
5 Comments
OverlappingElvis
Note that using named function expressions isn't necessary for recursion — since
a is available in the scope of the inner function, you can do a(v - 1) in your example.
Scott Sauyet
@OverlappingElvis: But notice that this works with a different reference to the function, the
b reference in the example. Even if the original a reference was overridden, this technique would continue to work, whereas if you'd recurred on the a it would have broken down.
KooiInc
@ScottSauyet thanks, I wanted to explain it, but you were faster.
Scott Sauyet
@OverlappingElvis: And I would hope Kooilnc's updated code makes it even more clear.
OverlappingElvis
@ScottSauyet Yes for sure.
abc.FunctionExpressions- one just has a name.