html 匿名函数,一家之言：谈谈JavaScript匿名函数

匿名函数的概念大家也许不会陌生，但是我相信下面的内容会打开一些新的思路。

我们知道函数的定义方式有两种：

1 function fn1(){alert(‘fn1 works’);}

2 var fn2=function(){alert(‘fn2 works’);}

这两种方式有什么区别？思考一下…

1 第一种方式定义函数，函数声明过程在整个程序执行之前的预处理就完成了，所以只要处于同一个作用域，就可以访问到，即使在定义之前调用它也可以。

2 第二章方式就是匿名函数，这种方式函数只能按照程序流程执行到定义的那一行代码才被声明，所以只能在定义之后调用它。

举个例子

var fn1;

fn1();//报错

fn1=function(){

fn2();//fn2 works

alert(‘fn1 works’);

return false;

function fn2(){

alert(‘fn2 works’);

}

}

fn1();//fn2 works + fn1 works

我们看到fn2虽然处在return之后，程序流程并没有执行到它，但是它依然可以被使用，反之fn2只有在它被定义之后才会被正常执行。

明白了这个，下面看一看匿名函数在递归里用处

递归就是函数内部调用自己，举个例子

function fn1(n){

return n>2?fn1(n-1)+fn1(n-2):n;

}

当我们想把这个函数赋给其他的对象属性时，就要用到匿名函数，比如

obj1={

fn:function(n){

return n>2?obj1.fn(n-1)+obj1.fn(n-2):n;

}

}

obj2={

fn:obj.fn;

}

这个时候可以正常调用obj2.fn()，但是这里有一个隐患，我们必须保证obj1里的fn不能被覆盖，看下面的例子

obj1={}

obj2.fn();

obj1被清空，执行出错，怎么办，解决办法有很多，自己先想一个…

最容易的想到的是使用this，更改obj1里面fn的定义如下

obj1={

fn:function(n){

return n>2?this.fn(n-1)+this.fn(n-2):n;

}

}

这样即使obj1里的fn被改写也不影响obj2.fn()，但是this，你迷惑吗?

this在JavaScript里面绝对是一个难理解的概念，理解了最好，但是很多时候其实不一定非得用this，这个例子中，我们可以选个给匿名函数添加个名字

obj1={

fn:function fnname(n){

return n>2?fnname(n-1)+fnname(n-2):n;

}

}

我们发现和this的结果一样，但是这就避开了this的混淆视听，而且注意这个函数名只有函数内部可以访问，外部是访问不了的(请私下测试)，这样就能避免诸如全局变量的问题。

还有一种解决方案，这个方案是最优雅的，所以我要作为大礼送给大家

我们知道有个arguments对象，这个对象里面有好多好玩的属性和方法，其中一个叫做callee，它的作用是调用函数本身！继续修改上面的例子

obj1={

fn:function(n){

return n>2?arguments.callee(n-1)+arguments.callee(n-2):n;

}

}

这个是目前我发现最优雅的方法，大家有其他更好的方案可以拿来讨论。

匿名函数的讨论先到此为止。