今天刚好是前一个项目上线的第二天,所以今天很闲,没什么事情做,突发奇想,想看看jQuery的源码。遂将看懂的一点记录与此,后续还会更新。

  今天主要说一下jQuery的初始化,jQuery初始化的时候都是没有用new关键字生成的,所以,下面试想,如果不用new,jQuery的源码应该是这样的

var jQuery = function(selector, context) {
    return new jQuery(selector, context);
}

但是,但凡有一点编程基础的都会知道,这段代码会进入死循环,那jQuery源码到底是怎么解决的呢?带着这个疑问,请继续看下去。

  jQuery初始化源码如下: 

var jQuery = function (selector, context) {

    // The jQuery object is actually just the init constructor 'enhanced'
    // Need init if jQuery is called (just allow error to be thrown if not included)
    return new jQuery.fn.init(selector, context);
}
jQuery.fn = jQuery.prototype = {

    // The current version of jQuery being used
    jquery: version,

    constructor: jQuery,

    // The default length of a jQuery object is 0
    length: 0,

    init:function(){
        ...
    }
    //一些实例方法
    ...
}

最关键的一句

// Give the init function the jQuery prototype for later instantiation
jQuery.fn.init.prototype = jQuery.fn

  不知道大家是怎么理解的,反正我是看了几遍没看懂。
  最后,网上查阅资料,终于弄懂了,其实特别的简单,就是关于js原型的东西,一画图,就Ok了。自己画的图,比较丑。
  

不过,网上找了一张好看的图

大概就是这样了,不知道人们看不看的懂,有时候觉得会吹牛逼也是一种能力。

更多推荐

jQuery中关于jQuery.fn.init.prototype = jQuery.fn的解读