【jquery】jQuery对象之间的继承关系(热荐)

上一篇主要是讲了jQuery的选择器的写法优化，在文章的前边打下了伏笔，这篇我们就分析jQuery对象继承关系，主要也就是jQuery，jQuery.fn和jQuery.fn.init之间的关系。我先把大概的代码提炼到这里。

       var jQuery = function( selector, context ) {

          return new jQuery.prototype.init( selector, context );

       };

      //上边定义了jQuery类。

//下边的定义应该很简单，定义了一个属性fn，到现在为止jQuery有两个属性fn和js默认的prototype原型，但是这两个属性是指向同一个对象，也就是说修改任何一个，另一个都会变化。

      jQuery.fn = jQuery.prototype={

         init:function(selector, context ){

           //...................

           return jQuery().find(selectot);

        }

      }

     //测试一下，看看有什么不同。

     for(var i in jQuery) alert(i + ' '+jQuery[i] );//有两个属性fn和prototype

   jQuery.fn.test='yyyy';//给fn增加一个子属性

   for(var i in jQuery.fn) alert(i + ' '+jQuery.fn[i] );//fn有一个属性test和一个方法init

   for(var i in jQuery.prototype) alert(i + ' '+jQuery.prototype[i] );//prototype和fn一样

现在的init就是fn和prototype的一个方法。想调用只能jQuery.fn.init()或者是jQuery.prototype.init()，那怎么办呢？你看我们一般都是这样调用fn里面的函数，$().xxx()，那就要想办法在jQuery中返回fn或者是protoype对象，为了达到这个目的实际上return jQuery.prototype就可以实现，但是程序本身还需要执行init这个方法，那就是下边的代码起了作用，把fn在绑定到init的prototype原型上，这时候就相当月申明了一个jQuery.fn.init类，而且原型指向fn对象，是不是就统一了？这句效果就相当于

jQuery.fn.init=function(selector, context){

    //...................

           return jQuery().find(selectot);

   ////其他的fn方法

}

     //下面这行代码表明init是一个类,jQuery.fn.init.prototype = jQuery.fn就是将JQuery.fn中的方法继承(或传递)给JQuery.fn.init类对象

     jQuery.fn.init.prototype = jQuery.fn;//两种情况,即: 1、new jQuery.fn.init( selector, context );时init是一个类   2、JQuery.fn.init();时init是一个方法

fn的init方法和大多数的方法又是返回jQuery数组对象，实现了连写，实际上这里fn属性的定义完全可以去掉。jQuery.fn.init.prototype = jQuery.fn;可以改成jQuery.fn.init.prototype = jQuery.protoype;效果一样，以后的扩展函数可以写成jQuery.protoype.xxx=function(){}但是为了兼容版本就不得不这样写了。

现在是不是大概有点明白了？这个只是从对象引用的角度分析，因为这样分析更容易接受，所以上边讲的调用都是静态调用，jQuery.fn.init();在静态调用的时候prototype就可以理解成一个静态的属性，如果加了new就不一样了，那就是类之间的继承，先做这样的测试

var obj=new jQuery();obj.init();下篇再说继承关系。