javascript - 使用函数表达式时，匿名函数和命名函数有区别吗？

问题描述

问 题

var baz = function() {
  console.log("bar2");
};

上面使用的是 匿名函数
下面使用的是 命名函数
在使用函数表达式的时候，这两种方法有什么区别吗？

var baz = function e() {
  console.log("bar2");
};

解决方案

按照ECMAScript标准，函数表达式的样式如下(opt记号代表的是可选的，也就是可有可无的意思):

FunctionExpression :
function Identifier opt ( FormalParameterList opt ){ FunctionBody }

函式表达式中函数的识别名是可以不需要有的，有名称的函数表达式，也就是所谓的"具名函数表达式"(Named function expressions，NFE)，这个函数的识别名，它的作用域是只能在函数的主体(FunctionBody)内部。原因当然它只是个原本就可有可无的"代理"函数名，真正的这函数识别名称是被赋值的那个变量识别名。

正常情况下，你只能在函数表述式中的主体中使用这个"代理函数名"，这也是符合标准的规定，如下面的例子:

var f = function foo(){
  return typeof foo; 
};
typeof foo; // "undefined"
f(); // "function"

那么又为何要使用这个"代理函数名"，不是可有可无的吗？

因为这个名称在调试时，可以明确地在呼叫堆叠中看到，如果是不加这名称，也就是"匿名函数表达式"在调试时是看不准是呼叫什么的。这使得调试时多了一些便利，所以它会被用在这个情况下。

但在IE8之前的IE版本，它对待这个"代理函数名"，可以像一般的函数声明一样。因为以IE8来说，它里面的JS引擎并不是现在的标准ECMAScript规定，而是JScript 5.8。

IE8并没有设计这个封闭作用域，来界定出函数表达式的作用域，而且，在IE8中认为这种有"具名函数表达式"，相等于函数声明。而且IE8还会认为这两个函数(被赋值的变量与这个代理名)是两个不同的函数物件，例如下面的例子:

var f = function foo(){
  return 23; 
}

alert(f === foo); //false

以上的资料主要参考Named function expressions demystified与Function Declarations vs. Function Expressions

本篇答案是改编自我之前在这篇问答中的答案。

这篇关于javascript - 使用函数表达式时，匿名函数和命名函数有区别吗？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！