js之匿名函数及其应用

通常我们在引入jquery时，或者引用js插件时经常看到开头有一些让人很难以理解的js代码，如果不理解清楚，会对阅读插件源码进行高阶编程造成障碍。

比如，jquery源码中

1. (function( global, factory ) {
    	//jquery内容
   	window.jQuery = window.$ = jQuery;                                                                                                                  
           return jQuery;
   });

先来看一个写法如：

1. var a = function(t) { return t; }  
2. (1 + 2).toString();  
3. alert(a);   

注意，上面一个代码片段的第一行之间由于没有分号隔开，就构成了一个匿名函数、导致最终alert的内容a的值为3,如果加了分号隔开，最终结果就是function(t) { return t; }

显然，该匿名函数进行了传参操作，匿名函数的原始写法为

1. (function(param) {
    	//jquery内容
   //这里操作param
   })（3）;

以上小括号里的（3）会作为一个值传递给param;所以就有了以下

1. var a = function(t) { return t; }  
2. (1 + 2).toString();  //由于该行和上一行没有分号，该行又是以小括号开始,符合匿名函数规则即（函数）(参数);注：等同于函数(参数);所以会把计算后3的值传给参数t，最终a的值为3

接下来我们来看一下匿名函数还有没有其它用处

场景是这样的，比如我随便打开一个网页，这个网页加载完，我想在这个网站上绑定我自己的js文件以便达到操作该界面内容的目的，现在以chrome的控制台为例进行如下操作，比如我想在一个页面引入jquery文件，然后通过jquery操作dom元素

代码如下：

1. (function(){
       function callback(){ 
           document.head.appendChild(s);
       };
       var s=document.createElement("script");   
      s.src="http://cdn.bootcss.com/jquery/3.1.0/jquery.js";          
      if(s.addEventListener){        
          s.addEventListener("load",callback(),false);   
      }else if(s.readyState){       
         s.onreadystatechange=callback();    
       }   
       document.body.appendChild(s);
   })();//该段代码既可以在url地址栏执行，只要在代码前面加上javascript:即可，也可以在chrome控制台执行
   

2. var script = document.createElement("script")
   script.type = "text/javascript";
   script.src = "http://cdn.bootcss.com/jquery/3.1.0/jquery.js";
   document.getElementsByTagName("head")[0].appendChild(script); //片段2的普通代码和1的效果一样，直接贴到控制台运行，匿名函数可以看作是执行一行代码