在JavaScript中同时声明变量和函数

Question

Can anyone explain why

function x() {
  console.log("Hello!");
}
var a = x;
a();
x();

produces

Hello!
Hello!

but this

var a = function x() {
  console.log("Hello!");
}
a();
x();

throws an error when you try to call function x? Is the second x function not considered a hoisted function? I tried this in both nodejs and a browser.

Answer 1

What you have in the second example is what's called a named function expression .

Its name is not added to the containing scope, but is accessible within the scope of the function itself:

var a = function x() {
  alert(x);
};
a();

This is useful in writing recursive functions or functions that otherwise reference themselves, as it ensures that the name won't get clobbered due to anything that happens outside the function's scope.

It also allows you to create self-referencing functions in places where you can't use a function declaration, such as in an object literal:

var myFavoriteFunctions = {
    factorial: function f(n) {
        return n === 1 ? 1 : n * f(n);
    },
    identity: function (v) { return v; }
};

console.log(myFavoriteFunctions.factorial(10));

Answer 2

Your first example is a function statement, which declares a name in its containing scope.

Your second example is a named function expression, which does not.

For more information, see here .