前言: jQuery的源码不同于prototype, mootools, 它们对Array, String, Event, Hash都进行了大量的扩展,然后才对element, form之类的dom元素提供了方便及兼容的操作。jQuery的源码也不同于YUI,采用组件的方式按照JAVA面向对象的中规中律地去构建类库,向用户提供方便的操作。
jQuery仅仅是一个对象,类数组的对象。它没有对js的原始对象进行扩展。它没有分层分级去形成这样那样的继承方式(EXT中是这样)。它仅仅是所它认为自己所需要的操作都融合在jQuery对象中。
简介: jQuery为开发插件提供了两个方法,分别是: jQuery.fn.extend():给jQuery对象提供方法。 jQuery.extend():为扩展jQuery类本身添加方法。
源码分析: jQuery.extend = jQuery.fn.extend = function() { //target的初始值为第一个参数值与{}或操作的结果 //deep变量表示是否实行深度拷贝 var target = arguments[0] || {}, i = 1, length = arguments.length, deep = false, options, name, src, copy; //如果是(对象的)深度拷贝(第一个参数为true),则进行深度拷贝 if (typeof target === “boolean”) { deep = target; //target指向第二个参数 target = arguments[1] || {}; //跳过后面的for循环 i = 2; } //如果target初始值类型不对,置为{} if (typeof target !== “object” && ! jQuery.isFunction(target)) { target = {}; } //如果只有一个参数被传入,则将参数表示的对象的属性和方法复制给jQuery或jQuery对象 if (length === i) { target = this; --I; } for ( i < length; i ++) { //当参数都为非空时 if ((options = arguments[i]) != null) {
//扩展基本的对象 for (name in options) { src = target[name]; copy = options[name]; //避免options中指定错误或者冲突引起的死循环 if (target === copy) { continue; } //递归处理,实现默认对象到自定义对象的深度拷贝 if (deep && copy && (jQuery.isPlainObject(copy) || jQuery.isArray(copy))) { var clone = src && (jQuery.isPlainObject(src) || jQuery.isArray(src) ? src : jQuery.isArray(copy) ? [] :{} target[name] = jQuery.extend(deep, clone, copy); //避免出现undefinded类型的数据进入插件内部 } else if (copy !== undefinded) { target[name] = copy; } } } } return target; } 小结: 1. 从源码中可以看出jQuery.extend和jQuery.fn.extend是同一个方法,但是具体的作用却不一样。因为在调用jQuery.extend 和jQuery.fn.extend 函数时,函数内部this是不同的,jQuery.extend()内this当然是jQuery,而jQuery.fn.extend当然是jQuery.fn,这样jQuery.extend()为扩展jQuery类本身.为类添加新的方法。jQuery.fn.extend()是给jQuery对象添加方法。 2. extend(src):将src对象的属性和方法逐一复制给jQuery或jQuery对象 3. extend(dest, src1, src2, src3..srcN):将src1, src2…对象的属性和方法逐一复制给dest对象。需注意的是,在复制的过程中,排在后面的参数(对象)将会覆盖排在前面的参数和属性的方法。 4. extend(boolean, dest, src1,src2…):jQuery的extend方法提供了“深层拷贝”的功能,如果传入第一个参数为boolean型变量,则该变量为深层拷贝的标志,第二个参数为extend方法的目标对象,其余参数为需要进行继承的“父类”。如果第一个参数的值为true(深度拷贝),并且dest和src元素都包括相同名称的对象属性,则对该对象的属性和方法再进行一次复制。
//扩展基本的对象 for (name in options) { src = target[name]; copy = options[name]; //避免options中指定错误或者冲突引起的死循环 if (target === copy) { continue; } //递归处理,实现默认对象到自定义对象的深度拷贝 if (deep && copy && (jQuery.isPlainObject(copy) || jQuery.isArray(copy))) { var clone = src && (jQuery.isPlainObject(src) || jQuery.isArray(src) ? src : jQuery.isArray(copy) ? [] :{} target[name] = jQuery.extend(deep, clone, copy); //避免出现undefinded类型的数据进入插件内部 } else if (copy !== undefinded) { target[name] = copy; } } } } return target; } 小结: 1. 从源码中可以看出jQuery.extend和jQuery.fn.extend是同一个方法,但是具体的作用却不一样。因为在调用jQuery.extend 和jQuery.fn.extend 函数时,函数内部this是不同的,jQuery.extend()内this当然是jQuery,而jQuery.fn.extend当然是jQuery.fn,这样jQuery.extend()为扩展jQuery类本身.为类添加新的方法。jQuery.fn.extend()是给jQuery对象添加方法。 2. extend(src):将src对象的属性和方法逐一复制给jQuery或jQuery对象 3. extend(dest, src1, src2, src3..srcN):将src1, src2…对象的属性和方法逐一复制给dest对象。需注意的是,在复制的过程中,排在后面的参数(对象)将会覆盖排在前面的参数和属性的方法。 4. extend(boolean, dest, src1,src2…):jQuery的extend方法提供了“深层拷贝”的功能,如果传入第一个参数为boolean型变量,则该变量为深层拷贝的标志,第二个参数为extend方法的目标对象,其余参数为需要进行继承的“父类”。如果第一个参数的值为true(深度拷贝),并且dest和src元素都包括相同名称的对象属性,则对该对象的属性和方法再进行一次复制。