javascript 匿名函数与普通函数

Anonymous function vs normal function

提问by Bluefire

Just out of interest, are there any speed/functionality differences between

只是出于兴趣，两者之间是否存在任何速度/功能差异

function foo(bar) {
    alert("foo" + bar);
}

and

和

var foo = function(bar) {
    alert("foo" + bar);
};

回答by T.J. Crowder

There are no significant speed differences. (Test)

没有显着的速度差异。（测试）

There are functionality differences.

存在功能差异。

• Function declarations (like your first) and function expressions (like your second) are processed at different times.
• They have different effects on the scope in which they occur.
• Your first function has a true name, your second does notin ES5 and earlier, your second does not; in ES6/ES2015, it does, because the specification says that the JavaScript engine must assign the name of the variable to the function in that case.

• 函数声明（如您的第一个）和函数表达式（如您的第二个）在不同时间处理。
• 它们对它们发生的范围有不同的影响。
• 你的第一个函数有一个真实的 name，你的第二个在 ES5 和更早的版本中没有，你的第二个没有；在 ES6/ES2015 中，它确实如此，因为规范说在这种情况下 JavaScript 引擎必须将变量的名称分配给函数。

If you look around for "function declaration" vs. "function expression" you'll find a lotof talk (some of it even correct) on the topic.

如果您四处寻找“函数声明”与“函数表达式”，您会发现有关该主题的很多讨论（其中一些甚至是正确的）。

But briefly:

但简单地说：

Function Declaration

函数声明

A function declarationlike your first example happens when the execution cursor enters its containing scope (containing function or the global scope), before any step-by-step code is done. Therefore they cannot appear within non-function blocks (if, try, etc.), since no step-by-step code has been run when they're processed. The name of the function is added to the scope in which it appears, and the function object has a true name (although there's no standard way to querythat name, it's still useful in stack traces and such). (Note: Some JavaScript engines allow function declarations within blocks, but it's invalidand what they do is not necessarily consistent. Don't do it.)

甲函数声明当执行光标进入其含有范围（含有功能或全局范围），任何一步一步的代码完成之前喜欢你的第一实例发生的情况。因此，它们不能出现在非功能块（if、try等）中，因为在处理它们时没有运行分步代码。函数的名称被添加到它出现的作用域中，并且函数对象有一个真实的名称（虽然没有标准的方法来查询这个名称，但它在堆栈跟踪等中仍然很有用）。（注意：一些 JavaScript 引擎允许在块内声明函数，但这是无效的，并且它们所做的不一定一致。不要这样做。）

Anonymous Function Expression

匿名函数表达式

A function expressionlike your second example happens, like all expressions, when it's encountered in the step-by-step flow of the code. Your expression is called an anonymous function expressionsince it doesn't explicitly specify a name for the function. In ES5 and earlier, that meant that the resulting function had no name. In ES6/ES2015 and later, many functions created with anonymous function expressions dohave names because the name can be inferred from the expression, and that's the case with your example, in which the function ends up with the name the variable has: foo. Since anonymous function expressions are expressions, they can occur anywhere expressions can occur, although sometimes you have to warn the parser that that's what you're doing.

像您的第二个示例一样的函数表达式，就像所有表达式一样，在代码的分步流程中遇到时就会发生。您的表达式称为匿名函数表达式，因为它没有明确指定函数的名称。在 ES5 及更早版本中，这意味着生成的函数没有名称。在 ES6/ES2015 及更高版本中，许多使用匿名函数表达式创建的函数确实具有名称，因为可以从表达式中推断出名称，您的示例就是这种情况，其中函数以变量的名称结尾：foo. 由于匿名函数表达式是表达式，它们可以出现在任何可能出现表达式的地方，尽管有时您必须警告解析器您正在这样做。

Named Function Expression

命名函数表达式

There's a third way of doing this: A namedfunction expression, rather than an anonymous one. They look like this:

还有第三种方法：命名函数表达式，而不是匿名函数表达式。它们看起来像这样：

var foo = function bar() {
};

or

或者

var obj = {
    foo: function bar() {
    }
};

or

或者

doSomething(function bar() { });

etc.

等等。

They used to be reallyproblematic cross-browser (IE8 and earlier mess them up, for instance; early versions of Safari had issues, etc.; Kangax has a good pageof the problems that used to abound). It's an expression, so it's valid anywhere there's an expression. The function name(barin my example) is notadded to the containing scope by a compliant JavaScript engine.

它们曾经是跨浏览器的真正问题（例如，IE8 和更早版本把它们搞砸了；Safari 的早期版本有问题，等等；Kangax 有一个很好的页面，说明了过去比比皆是的问题）。这是一个表达式，所以它在任何有表达式的地方都有效。的函数名（bar在我的例子）是未由柔顺JavaScript引擎添加到含范围。