匿名函数的理解与分析
初次遇到匿名函数的时候,是在我刚开始学jquery的时候,浏览JQ的底层代码的时候看到的。
(function(){
//...代码..
})();
在看到源码的第一眼,我就迷糊了。为什么只有一个匿 名函数又没看到运行(当然是运行了……),就能有jQuery这么个函数库了?然后开始从网上搜它的答案,总结的答案是当一个匿名函数被括起来,然后再在后面加一个括号,这个匿名函数就能立即运行起来!
。。。
。。。
好厉害,但是为什么呢?那么我们就来讲下匿名函数。
要说匿名函数,我们首先要由函数本身说起。
那么,什么是函数呢,他们的定义是什么呢?
函数是将唯一的输出值赋予给每一输入的“法则”,通俗来讲,函数就是包裹在花括号中的代码块。
函数的创建方式有三种:
1.函数声明:
function sum1(n1,n2){
return n1+n2;
};
2.函数表达式,又叫函数字面量
var sum2=function(n1,n2){
return n1+n2;
};
3.函数构造法,参数必须加引号
var sum3=new Function('n1','n2','return n1+n2');
console.log(sum3(2,3));//5
函数说了,那什么是匿名函数呢?没错,顾名思义,匿名函数就是没有命名的函数。
那么匿名函数没有命名,要去怎么取得函数的引用位置,怎么调用呢?
方法1:
虽然没有名字,但是要调用一个函数,我们必须要有方法定位它,引用它。所以,我们会需要帮它找一个名字。例如:
var abc=function(a,b){
return a+b;
}
alert(abc(2,3));//5
这种用法是我们比较频繁遇到的。例如我们在设定一个DOM元素事件处理函数的时候,我们通常都不会为他们定名字,而是赋予它的对应事件引用一个匿名函数。
方法2::
对匿名函数的调用其实还有一种做法,也就是我们看到的jQuery片段——使用()将匿名函数括起来,然后后面再加一对小括号(包含参数列表);
(function(a){return a+2})(5)//7
(function(a,b){return a+b})(2,3)//5
(new function("x","y","return x*y;"))(2,3));//6
很多人到这里,都会有一个疑问,而这个以为并不是别的,而是在想这个最外层的小括号是什么东西?
小括号能把我们的表达式组合分块,并且每一块,也就是每一对小括号,都有一个返回值。这个返回值实际上也就是小括号中表达式的返回值。所以,当我们用一对小括号把匿名函数括起来的时候,实际上小括号对返回的,就是一个匿名函数的Function对象。因此,小
括号对加上匿名函数就如同有名字的函数般被我们取得它的引用位置了。所以如果在这个引用变量后面再加上参数列表,就会实现普通函数的调用形式。
你也可以理解成括号内自动执行.
说到现在,大家应该对匿名函数有个大致的理解,那紧接着一个问题来了。为什么要用到匿名函数呢?匿名函数的优点是什么?
对于我们这些刚开始接触前端,JS语言来说的小白,应该都接受过全局污染的支配感。
全局污染会极大的削弱仍需的灵活性,增大了模块之间的耦合性,在多人协作的时候,会造成全局变量的冲突,以致代码BOOM~
而解决全局污染问题有两种方法,
方法1:也就是我们所说的匿名函数,利用匿名函数将脚本包裹起来
function(){ var exp={}; var name="aa"; exp.method=function(){ return name; }; window.ex=exp; })(); alert(ex.method());
方法2:只创建一个全局变量,并定义该变量为当前应用的容易,吧把其他全局变量追加在该命名空间下
var my={}; my.name={ big_name:"zhangsan", small_name:"lisi" }; my.work={ school_work:"study", family_work:"we are" };
其实,讲到这里也是应该讲下和匿名函数紧密相关的---闭包了。因为实现了闭包的特性绝对使用了匿名函数。
但是,这次我们总结的是匿名函数,所以这个我们下次在总结吧。哈哈 原谅我的偷懒~