频道导航

• ▸ PHP
• ▸ Java
• ▸ Java SE
• ▸ Python
• ▸ C#
• ▸ C&C++
• ▸ Ruby
• ▸ VB
• ▸ asp.Net
• ▸ Go
• ▸ Perl
• ▸ netty
• ▸ Django
• ▸ Delphi
• ▸ Jsp
• ▸ .NET Core
• ▸ Spring
• ▸ Flask
• ▸ Springboot
• ▸ SpringMVC
• ▸ Lua
• ▸ Laravel
• ▸ Mybatis
• ▸ Asp
• ▸ Groovy
• ▸ ThinkPHP
• ▸ Yii
• ▸ swoole
• ▸ HTML
• ▸ HTML5
• ▸ JavaScript
• ▸ CSS
• ▸ jQuery
• ▸ Bootstrap
• ▸ Angularjs
• ▸ TypeScript
• ▸ Vue
• ▸ Dojo
• ▸ Json
• ▸ Electron
• ▸ Node.js
• ▸ extjs
• ▸ Express
• ▸ XML
• ▸ ES6
• ▸ Ajax
• ▸ Flash
• ▸ Unity
• ▸ React
• ▸ Flex
• ▸ Ant Design
• ▸ Web前端
• ▸ 微信小程序
• ▸ 微信公众号
• ▸ iOS
• ▸ Android
• ▸ Swift
• ▸ Hybrid
• ▸ Cocos2d-x
• ▸ Flutter
• ▸ Xcode
• ▸ Silverlight
• ▸ cocoa
• ▸ Cordova

• 前端之家
• JavaScript
• 跟我学习javascript的函数和函数表达式

@H_404_0@表达式和声明存在着十分微妙的差别，首先，函数声明会在任何表达式被解析和求值之前先被解析和求值，即使你的声明在代码的最后一行，它也会在同作用域内第一个表达式之前被解析/求值，参考如下例子，函数fn是在alert之后声明的，但是在alert执行的时候，fn已经有定义了：

@H_404_0@另外，还有一点需要提醒一下，函数声明在条件语句内虽然可以用，但是没有被标准化，也就是说不同的环境可能有不同的执行结果，所以这样情况下，最好使用函数表达式： 因为在条件语句中没有块级作用域这个概念

@H_404_0@函数声明的实际规则如下：

@H_404_0@函数声明只能出现在程序或函数体内。从句法上讲，它们 不能出现在Block（块）（{ … }）中，例如不能出现在 if、while 或 for 语句中。因为 Block（块） 中只能包含Statement语句， 而不能包含函数声明这样的源元素。另一方面，仔细看一看规则也会发现，唯一可能让表达式出现在Block（块）中情形，就是让它作为表达式语句的一部分。但是，规范明确规定了表达式语句不能以关键字function开头。而这实际上就是说，函数表达式同样也不能出现在Statement语句或Block（块）中（因为Block（块）就是由Statement语句构成的）。

@H_404_0@

2、命名函数表达式

@H_404_0@提到命名函数表达式，理所当然，就是它得有名字，前面的例子var bar = function foo(){};就是一个有效的命名函数表达式，但有一点需要记住：这个名字只在新定义的函数作用域内有效，因为规范规定了标示符不能在外围的作用域内有效：

@H_404_0@既然，这么要求，那命名函数表达式到底有啥用啊？为啥要取名？

@H_404_0@正如我们开头所说：给它一个名字就是可以让调试过程更方便，因为在调试的时候，如果在调用栈中的每个项都有自己的名字来描述，那么调试过程就太爽了，感受不一样嘛。

@H_404_0@tips:这里提出一个小问题：在ES3中，命名函数表达式的作用域对象也继承了 Object.prototype 的属性。这意味着仅仅是给函数表达式命名也会将 Object.prototype 中的所有属性引入到作用域中。结果可能会出人意料。

@H_404_0@该程序看起来会产生 null,但其实会产生一个新的对象。因为命名函数表达式在其作用域内继承了 Object.prototype.constructor（即 Object 的构造函数）。就像 with 语句一样，这个作用域会因 Object.prototype 的动态改变而受到影响。幸运的是，ES5 修正了这个错误。

@H_404_0@这种行为的一个合理的解决办法是创建一个与函数表达式同名的局部变量并赋值为 null。即使在没有错误地提升函数表达式声明的环境中，使用 var 重声明变量能确保仍然会绑定变量 g。设置变量 g 为 null 能确保重复的函数可以被垃圾回收。

@H_404_0@

3、调试器（调用栈）中的命名函数表达式

@H_404_0@刚才说了，命名函数表达式的真正用处是调试，那到底怎么用呢？如果一个函数有名字，那调试器在调试的时候会将它的名字显示在调用的栈上。有些调试器（Firebug）有时候还会为你们函数取名并显示，让他们和那些应用该函数的便利具有相同的角色，可是通常情况下，这些调试器只安装简单的规则来取名，所以说没有太大价值，我们来看一个例子：不用命名函数表达式

// 这里我们使用了3个带名字的函数声明
// 所以当调试器走到debugger语句的时候，Firebug的调用栈上看起来非常清晰明了
// 因为很明白地显示了名称
baz
bar
foo
expr_test.html()

@H_404_0@通过查看调用栈的信息，我们可以很明了地知道foo调用了bar,bar又调用了baz（而foo本身有在expr_test.html文档的全局作用域内被调用），不过，还有一个比较爽地方，就是刚才说的Firebug为匿名表达式取名的功能：

// Call stack
baz
bar() //看到了么？
foo
expr_test.html()

@H_404_0@然后，当函数表达式稍微复杂一些的时候，调试器就不那么聪明了，我们只能在调用栈中看到问号：

// Call stack
baz
(?)() // 这里可是问号哦，显示为匿名函数(anonymous function)
foo
expr_test.html()

@H_404_0@另外，当把函数赋值给多个变量的时候，也会出现令人郁闷的问题：

// Call stack:
bar()
foo
expr_test.html()

@H_404_0@这时候，调用栈显示的是foo调用了bar，但实际上并非如此，之所以有这种问题，是因为baz和另外一个包含alert(‘spoofed')的函数做了引用交换所导致的。

@H_404_0@归根结底，只有给函数表达式取个名字，才是最委托的办法，也就是使用命名函数表达式。我们来使用带名字的表达式来重写上面的例子（注意立即调用的表达式块里返回的2个函数的名字都是bar）：

// 又再次看到了清晰的调用栈信息了耶!
baz
bar
foo
expr_test.html()

@H_404_0@好的，整个文章结束，大家对javascript的认识又近了一步，希望大家越来越喜欢小编为大家整理的文章，继续关注跟我学习javascript的一系列文章。