part 1

注意：本次源码分析选择2.0.3(因为不支持IE6、7、8，就少了很多兼容的hack的写法，对了解jQuery的实现原理有很大的帮助)

1.jQuery有不同的版本，从2.x版本便不再支持IE6、7、8

将jQuery拆分长框架一点一点进行了解

(function ())();

这个叫匿名函数自执行

3.匿名函数自执行的好处是什么呢？

匿名函数自执行里面的所有东西都是一个局部的。防止和其他的代码冲突。

栗子①

(function () {
var a=10;
})();
alert(a);

控制台报错，说a is not defined。

4.如何能够访问到匿名函数自执行中的方法呢？

很多种方法(⊙o⊙)哦。可以把你要对外提供的接口作为window的属性或者是方法。

栗子②

(function () {

    var a=10;

    function abc(){

        alert(a);

    }

    //将abc方法作为window的方法，就可以在匿名函数自执行外面进行访问了

    window.abc=abc;

})();

abc();

但是要对外提供接口，我们才能找到使用的方法和属性

5.在jQuery中，$()是jQuery()的简写方式。

6.在jQuery文件中第21行到第94行就是定义了一些变量和函数。

其中，60-64行是一个特别重要的函数,就是平时用的$() jQuery()对外的接口

// Define a local copy of jQuery

jQuery = function( selector, context ) {

    // The jQuery object is actually just the init constructor 'enhanced'

    return new jQuery.fn.init( selector, context, rootjQuery );

},

但是现在这个jQuery还是以局部变量的形式存在，要提供对外的接口，才能使用。提供接口在第8823-8827行

// If there is a window object, that at least has a document property,

// define jQuery and $ identifiers

if ( typeof window === "object" && typeof window.document === "object" ) {

    window.jQuery = window.$ = jQuery;

}

7.在第96-283行，都是给jQuery对象添加一些方法和属性。

prototype(原型)是面向对象的东西，所以说，jQuery就是一个基于面向对象的程序，jQuery里面写的都是跟面向对象有关的。

//96行
jQuery.fn = jQuery.prototype

8.为什么jQuery是一个基于面向对象的程序？？

栗子③

//jQuery是这样调用方法的对吧。是不是和下面数组使用方法的方式非常像。
//但是实际上$("div")他本身是一个函数调用，但是函数调用的执行结果是一个对象，所以，这就是为什么说jQuery是基于面向对象的程序喽~~~
$("div").css();

$("div").text();


//这是Array对象方法的使用方式，先实例化一个对象，然后使用对象调用方法。

var arr=new Array(3);

arr.sort();

arr.splice();

//61--64
jQuery = function( selector, context ) {

    //在这个函数执行完了就是一个new构造函数的过程，返回的就是一个jQuery对象~~既然返回的是对象，当然可以调用方法喽~~

    return new jQuery.fn.init( selector, context, rootjQuery );

}

9.285--347行--> extend:是jQuery当中的一个继承方法，希望后续添加的方法都能挂在jQuery对象上，很方便扩展

10.

//通过使用对象调用的方法，是实例方法。

$().text();

$().html();

//$是一个函数，在函数下面来扩展方法的话，就是扩展一些静态方法

//在jQuery当中，给面向对象扩展静态属性和静态方法叫做扩展工具方法
//工具方法和实例方法区别就在于，它既可以给jQuery对象来用，也可以给源生的JS来用，实例方法只能给jQuery对象调用
$.trim();

$.proxy();

11.静态方法和实例方法在jQuery中的关系？

可以把静态方法看作是在jQuery中的最底层，而实例方法是上一层或者是更高层的。

很多方法都是实例方法，里面调用的都是工具方法。

12.877行--2856行 Sizzle 复杂选择器的实现

13.2880行--3042行 Callbacks 回调对象 : 函数的统一管理

什么是成功？就是所有失败的路都走过了，只剩下一条路还没有走，这条路就叫成功！

巴特西

part 1

最新文章

热门文章