$(function(){})、(function($){})(jQuery)、$(document).ready(function(){})解析

  • $就是jquery的简写,$()就是一个选择器,documenthtml所有元素,$(document)返回一个数组,而这个数组是一个对象,这个对象调用ready方法,function则是ready里面的参数,就是说等这个页面全部加载完之后就去执行写入的js。而且在$(document).ready(function(){  });里面写入的js特效是和下一个里面写入的特效是不冲突的,俩者之间是不影响的,因此可以通过$(function(){});在一个页面中加载多个js$(document).ready(function(){  })简写就是$(function(){});
  • (function($) {…})(jQuery)

    1.原理:

        这实际上是匿名函数,如下:function(arg){…},这就定义了一个匿名函数,参数为arg,而调用函数时,是在函数后面写上括号和实参的,由于操作符的优先级,函数本身也需要用括号,即:(function(arg){…})(param)

        这就相当于定义了一个参数为arg的匿名函数,并且将param作为参数来调用这个匿名函数。(function($){…})(jQuery)则是一样的,之所以只在形参使用$,是为了不与其他库冲突,所以实参用jQuery

        相当于funtion output(s){…};output(jQuery);或者var fn=function(s){…};fn(jQuery);

    2).作用(非常有用):

    这种写法的最大好处是形成闭包。在(function($) {…})(jQuery)在内部定义的函数和变量只能在此范围内有效。

    形成是否函数函数、私有变量的概念。比如:

    1 var AA = [1,2,3];
    2 console.log("outer1AA"+AA);//123
    3 (function(window,x){
    4 console.log("x1",x);//123
    5 x = [3,4,5];
    6 console.log("x2",x);//345
    7 console.log("innerAA"+AA);//123
    8 })(window,AA);
    9 console.log("outer2AA"+AA);//123
    //解析:传进参数AA的时候,js做的操作实际上是把AA的内容复制了一份,交给了x,
    //(注意,不是把AA指向的地址赋给x),此时x和AA内容相同,可是相互独立。后面对x的修改并不会对AA造成影响。

     

     

posted on 2017-02-28 16:02  Cultivate  阅读(207)  评论(0编辑  收藏  举报

导航