JavaScript 权威指南(2): JavaScript 匿名函数
发布在蓝翔出品:JavaScript 权威指南2014年11月26日view:3535
在文章任何区域双击击即可给文章添加【评注】!浮到评注点上可以查看详情。

匿名函数就是在运行时动态声明的函数。之所以称作匿名函数,是因为它不像标准的函数会给定一个函数名称。

匿名函数是使用 function 操作符定义的,而不是使用函数声明的方式定义的。可以使用 function 操作符创建一个新的函数,无论它是否是一个有效的表达式。例如,你可以定义一个新的函数作为另一个函数的参数,或者作为一个对象的属性。

下面是一个典型的命名函数:

function flyToTheMoon()
{
  alert("Zoom! Zoom! Zoom!");
}
flyToTheMoon();

下面是一个用匿名函数创建的和上面相同的函数:

var flyToTheMoon = function()
{
  alert("Zoom! Zoom! Zoom!");
}
flyToTheMoon();

匿名函数是使用函数操作符创建的

在 JavaScript 中创建函数最常见的两种方式分别是使用函数声明和函数操作符。而匿名函数便是使用函数操作符创建的。

如果 function 关键字首先出现在声明中,同时紧跟一个函数名,则说明这个函数是通过函数声明的方式创建的:

如果 function 关键字出现在其他地方,那么它可能只是被用作一个函数操作符:

当 function 操作符被调用的时候,它会创建一个新的函数对象并返回它。下面有一个例子,我们创建了一个函数,然后将它分配给了一个名为 myFunction 的变量:

var flyToTheMoon = function() {
  alert("Zoom! Zoom! Zoom!");
}

这个分配工作与你将任何函数的返回值分配给一个变量的方式相同,唯一不同的是,在上面的代码中分配给变量的是一个函数对象,而不是一个简单的值,诸如:数字,或者是一个日期。

这是可以的,因为函数在 JavaScript 知识一个特殊类型的对象。这意味着使用它们可以像使用其他任何对象一样。它们可以存储在变量中,作为参数传递给其他函数,或者使用 return 语句从函数中返回。函数始终都是对象,不管它们是如何创建的。

一旦函数保存到变量中,就可以使用该变量来调用它:

lyToTheMoon();

匿名函数创建于运行时

function 操作符可以用于任何地方有效的使用表达式。比如可以在变量定义中,或者给函数传递参数时或者 return 语句中。这是可以的,因为 function 操作符时钟在运行时调用。

而函数声明与此不同。它们会在任何其他代码执行之前运行,因此它们可以在没有定义之前调用。

函数声明不能用来创建匿名函数,因为它们必须有一个函数名。函数声明会将它的函数名作为当前作用域中的一个变量。

匿名函数没有函数名

这似乎有些奇怪,匿名函数没有函数名,那我们如何调用它呢?其工作原理是它的函数名是用来保存函数对象的变量。

使用函数声明创建的函数始终有一个函数名,函数变量与之完全相同,因为函数声明会自动创建该变量给你。

function flyToTheMoon() {
  alert("Zoom! Zoom! Zoom!");
}
flyToTheMoon();

对于使用 function 操作符创建的函数,其名称是可选的。在大多数情况下,这个函数名并不重要,因此我们通常都会创没有名称的匿名函数:

var flyToTheMoon = function() {
   alert("Zoom! Zoom! Zoom");
}
flyToTheMoon();

然而,如果设置一个名称,function 操作符也是支持的。下面是一个与上面相同的函数,只是在这里有一个函数名:

var flyToTheMoon = function flyToTheMoon() {
   alert("Zoom! Zoom! Zoom");
}
flyToTheMoon();

但是给定的函数名并不会将这个函数名作为变量自动添加到作用域中。仍然需要将这个 function 操作符的返回值分配给一个变量。

在上面的例子中,存储函数对象的变量和函数名想听,其实它们也可以不相同:

var thingsToDoToday = function flyToTheMoon() {
   alert("Zoom! Zoom! Zoom");
}
thingsToDoToday();

为什么匿名函数也可以有一个函数名?

函数名可以用于在函数自身内部调用该函数。这对于函数递归来说非常有用:

var thingsToDoToday = function flyToTheMoon() {
  if(!onTheMoon)
    flyToTheMoon();
  else
    alert("One small step for a man..");
}
thingsToDoToday();

这也有利于调试工作,因为这样就可以在函数调用栈中看到对应的函数名。匿名函数通常在调用栈中看起来一样。如果有调试的需求,又是有给匿名函数一个名称可以让开发人员更清除代码的运行。

$$solo_more$$

为什么匿名函数如此有用?

不必为匿名函数设置一个函数名只是比较方便,因为大多数情况下函数名并不是特别重要。并且大多数的时间里匿名函数和命名函数都能工作得很好。

原文:http://helephant.com/2008/08/23/javascript-anonymous-functions/

评论
发表评论
5年前
赞了此文章!
5年前

@Go7hic “我看你是块写文章的好料”

5年前

@前端乱炖 芋头哥请看 这个专栏介绍

5年前

支持

WRITTEN BY
PUBLISHED IN
蓝翔出品:JavaScript 权威指南

不是犀牛书的笔记,整理的国外几篇文章,找到有中文版的我就直接搬过来了,没有就靠谷歌翻译了。

麻麻问我怎么不开心

我说在我的想象中有个好网站

学习前端肯定棒

整个网络找遍所有的网站都没有

她说将来会找到的

时间时间会给我答案

蓝翔毕业后再次寻找依然没有发现

我想我必须要离开

当我正要走时我看到了一个前端乱炖

那就是我要的前端网站

我的前端网站牛逼牛逼最牛逼

打酱油的路上我情不自禁

学习 学习

. . .

我的收藏