Awara 2018-09-03
【前言】
研究过Javascript代码库的人,会看到很多如下形式的函数: (function(){...}()) 或 (function(){})()
接下来简单总结概括下匿名函数相关知识点。
【主体】
(1)匿名函数:
(function(){})是一个标准的函数定义,但是没有赋值给任何变量。所以是没有名字的函数,叫匿名函数。没有名字就无法像普通函数那样随时随地调用了,所以在他定义完成后就马上调用他,后面的括号()是运行这个函数的意思。
(2)案例解析:
所以上面可以解释成为“匿名函数自调用”,也就是说,定义一个匿名函数,然后马上调用它(因为它是匿名的,如果不立即调用就获取不到该函数的引用了)。
(3)应用:
通常它被应用在一些大型的JS框架中(如上面所说的),因为这个匿名函数的函数体相当于提供一个匿名的名字空间,这样就不会再与用户自定义的JS函数、变量、对象发生冲突了。尽管JS没有显示地提供命名空间的定义和使用机制,但这种匿名方式却不失为是一种很好的解决命名空间问题的方法。
匿名函数:
(function(){...})(jQuery);
常用于存放开发插件的代码,执行其中代码时DOM不一定存在,所以直接自动执行DOM操作的代码要小心使用。开发插件的格式如下:
(function ($) { $.fn.test111 = function () { alert('test') } })(jQuery);
调用插件:
$("#elementid").test111();
匿名函数 function(arg){...} 为匿名函数,参数为arg。调用函数时,是在函数后面写上括号和实参的,由于操作符的优先级,函数本身也需要用括号,即: (function(arg){...})(param) 这就相当于定义了一个参数为arg的匿名函数,并且将param作为参数来调用这个匿名函数
而(function($){...})(jQuery)则是一样的,之所以只在形参使用$,是为了不与其他库冲突,所以实参用jQuery。等同于 var fn = function($){....}; fn(jQuery);
(funtion(){})();立即执行函数;相当于先申明一个函数,声明完后直接调用;
相当于:
(funtion(str){alert(str)})("output"));相当于:funtion OutPutFun(str){alert(str);};OutPutFun("output");
(4)通俗理解:
可以理解为一种闭包,把jQuery作为实参传入到形参为$的匿名函数里面。其写法相当于
function Test(t){ alert(t); }//定义函数 Test("Hello World!");//执行函数等价于
(function(t){alert(t);})("Hello World!");
一般写插件时避免变量全局污染,就用此方式写。
.