我这里就说说如下三种函数“声明”的差异不同和应用场景。
// 函数声明
function A() {}; // 定义一个匿名函数并赋值给一个变量 var B = function() {}; // 定义一个具名函数并赋值给一个变量 var C = function D() {};
先说A()
。
A 是一个标准的函数声明语句。这行代码明确地声明了一个名为A的函数。
函数的声明在解释器解释的过程中,是在执行期前。也就是说,你的代码还未执行前,这个函数就已经被声明了。
所以 A 这种方式可以后置声明,例如
A();
function A(){};
这样是不会出错的。
再说B()
B 的整个过程是这样的。首先声明一个变量B
(这个是在执行期前),然后定义一个匿名函数表达式,最后B
指向这个匿名函数表达式。
这种方式与 A 的区别在于,函数 B 是在执行期定义的。故这种方式去定义一个函数必须前置定义,否则在执行时会报类型错误——TypeError: undefined is not a function
。
还有就是,他是匿名函数,他是没有函数名的。例如执行以下代码:
// 以下代码在非严格模式下可以执行。严格模式会报错
// 声明 A
function A() {console.log(arguments.callee.name)} // 执行他 A() // A; 控制台里面会输出 // 定义 B var B = function() {console.log(arguments.callee.name)} // 执行他 B() // ;控制台会输出个空白行
最后一种 C()
和 D()
这种情况我们以 ES5 标准来说,IE 的非标准实现不讨论。
这种情况同 B 很相似。但是函数表达式定义了一个具名函数。也就是说这个函数是有自己的名字的。
但是这个名字却不是绑定在当前作用域下的。故直接调用 D()
会出错,如下
var C = function D() {} D(); // ReferenceError: D is not defined // D 未定义。
这个具名函数是为了解决严格模式下自己调用自己的问题的。
var C = function D() { if(true) D() } C();
这样就解决了前面的严格模式下不能访问 arguments.callee
以递归调用自己的问题了。
总结
知道区别了,我们就能灵活运用来写出优雅的代码。
- 如果想后置函数的声明,我们就可以用 A;
- 如果我只是想生成一个匿名函数把他设置为某个对象的属性,那就用 B;
- 如果 B 满足不了我,我还要递归调用自己,那就用 C/D。