源码解析~匿名函数(function(){})();

本文详细介绍了匿名函数自调用的概念,通过案例解析其工作原理,并探讨了其在JavaScript框架及插件开发中的实际应用。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

【前言】

      研究过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!");

 

    一般写插件时避免变量全局污染,就用此方式写。

      

 

 

 

.

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值