命名函数优先于JavaScript中的匿名函数吗？ [英] Are named functions preferred over anonymous functions in JavaScript?

问题描述

可能重复：

JavaScript：var functionName = function（）{} vs function functionName（）{}

在Javascript中提取函数有两种可能的方法：

There are two possible methods for pulling out a function in Javascript:

var foo = function() { ... }

这有点做作;另一个常见的模式是：

This is a bit contrived; another common pattern is:

var foo = {
   baz: 43,
   doSomething: function() {
       // ...
   }
}

与

function foo() { 
  // ... 
}

是否有明确的理由偏好其中一个？

Is there an explicit reason to prefer one or the other?

推荐答案

这一切都归结为你声明你的功能的地方的偏好;提升。

It all comes down to preference to where you declare your functions; hoisting.

函数声明和变量声明总是被JavaScript解释器无形地移动（提升）到其包含范围的顶部。显然，功能参数和语言定义的名称已经存在。这意味着代码如下：

Function declarations and variable declarations are always moved ("hoisted") invisibly to the top of their containing scope by the JavaScript interpreter. Function parameters and language-defined names are, obviously, already there. This means that code like this:

function foo() {
    bar();
    var x = 1;
}

实际上是这样解释的：

function foo() {
    var x;
    bar();
    x = 1;
}

请注意，声明的转让部分未被提升。只有名字被悬挂。函数声明不是这种情况，整个函数体也将被提升。

Notice that the assignment portion of the declarations were not hoisted. Only the name is hoisted. This is not the case with function declarations, where the entire function body will be hoisted as well.

function test() {
    foo(); // TypeError "foo is not a function"
    bar(); // "this will run!"
    var foo = function () { // function expression assigned to local variable 'foo'
        alert("this won't run!");
    }
    function bar() { // function declaration, given the name 'bar'
        alert("this will run!");
    }
}
test();

在这种情况下，只有函数声明将其主体提升到顶部。名称'foo'被提升，但是主体被遗忘，在执行期间被分配。

In this case, only the function declaration has its body hoisted to the top. The name 'foo' is hoisted, but the body is left behind, to be assigned during execution.

您可以为函数表达式中定义的函数指定名称，语法如下功能声明。这不会使它成为一个函数声明，并且名称不会被带入范围，也不会被提升。

You can give names to functions defined in function expressions, with syntax like a function declaration. This does not make it a function declaration, and the name is not brought into scope, nor is the body hoisted.

foo(); // TypeError "foo is not a function"
bar(); // valid
baz(); // TypeError "baz is not a function"
bin(); // ReferenceError "bin is not defined"

var foo = function () {}; // anonymous function expression ('foo' gets hoisted)
function bar() {}; // function declaration ('bar' and the function body get hoisted)
var baz = function bin() {}; // named function expression (only 'baz' gets hoisted)

foo(); // valid
bar(); // valid
baz(); // valid
bin(); // ReferenceError "bin is not defined"

因此，如果您希望将功能提升到top使用函数声明否则使用表达式。我更喜欢后者，因为我通常使用函数表达式的方法构建对象文字。

So, if your preference is to have functions hoist to the top use a function declaration otherwise use expression. I prefer the latter as I typically build object literals with methods as function expressions.

命名函数表达式在抛出错误时非常方便。控制台将告诉您该功能是什么，而不是说明匿名又名堆栈跟踪。

Named function expressions can be handy when errors are thrown. The console will tell you what the function is instead of stating anonymous aka stack trace.

这篇关于命名函数优先于JavaScript中的匿名函数吗？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！