jQuery1.4.1 代码分析(2对象访问,插件机制)

jQuery 的核心分为

jQuery 核心函数

jQuery 对象访问

数据缓存

队列控制

插件机制

多库共存

之前分析了核心函数,有太多的不明白.今天分析了 对象访问,插件机制  .jQuery1.4.1.js 和API 下载 .

/*
 * jQuery1.4.1 代码分析 isw2 zhoux
 */
//jQuery 插件机制
jQuery.fn = jQuery.prototype = {}//声明 jQuery.fn 是jQuery.prototype 的简写
jQuery.fn.init.prototype = jQuery.fn;//jQuery.fn.init 继承 jQuery.fn的所有方法(JavaScript中属性动态)
jQuery.extend = jQuery.fn.extend = function() {//从这里可以看出jQuery.fn.extend 和 jQuery.extend 是样的,两者只是调用对象不同,jQuery.fn(即jQuery.prototype),jQuery
	//arguments 代表传入参数,arguments[0]即第1个参数
	//javaScript 里没有块定义,这里用到变量在方法开始处声明
	var target = arguments[0] || {}, i = 1, length = arguments.length, deep = false, options, name, src, copy;
	if ( typeof target === "boolean" ) {//标记是否深入复制属性
		deep = target;//标记是否需要深入复制属性
		target = arguments[1] || {};//{}简写的方法一个新的对象
		i = 2;
	}
	if ( typeof target !== "object" && !jQuery.isFunction(target) ) {// target为非对象,非函数
		target = {};
	}
	if ( length === i ) {
		target = this;//如果jQuery.fn.extend,this代jQuery.fn(即jQuery.prototype);如果是jQuery.extend 则this代jQuery
		--i;
	}
	for ( ; i < length; i++ ) {
		if ( (options = arguments[ i ]) != null ) {//仅处理 non-null/undefined (javascript 中 != null  包扩undefined)
			for ( name in options ) {
				src = target[ name ];
				copy = options[ name ];
				if ( target === copy ) {//防止死循环
					continue;
				}
				if ( deep && copy && ( jQuery.isPlainObject(copy) || jQuery.isArray(copy) ) ) {//如果copy 的值是一个object 或数组,且deep == true
					var clone = src && ( jQuery.isPlainObject(src) || jQuery.isArray(src) ) ? src
						: jQuery.isArray(copy) ? [] : {};
					target[ name ] = jQuery.extend( deep, clone, copy );//递归
				} else if ( copy !== undefined ) {//不能使用undefined 的值
					target[ name ] = copy;
				}
			}
		}
	}
	return target;//返回修改后的值
};
jQuery.extend();// 针对jQuery 方法(类),扩展jQuery对象本身。
jquery.fn.extend();//针对jQuery 对象,扩展 jQuery 元素集来提供新的方法（通常用来制作插件）。
//jQuery 对象访问
jQuery.fn = jQuery.prototype = {
	each: function( callback, args ) {//$().each
		return jQuery.each( this, callback, args );
	},
	size: function() {
		return this.length;
	},
	length: 0,
	selector: "",
	get: function( num ) {//如果num == null || num < 0  返回Array.slice[0]即所有元素,否则根据num 返回($(**).[num]为简写,此方法用于获DOM 对象)
		return num == null ? this.toArray() : ( num < 0 ? this.slice(num)[ 0 ] : this[ num ] );
	},
}
jQuery.fn.extend({	
	index: function( elem ) {
		if ( !elem || typeof elem === "string" ) {//为字符串或空
			//如果是字符串使用jQuery 查找对象然后查找位置,如果是空则返回这个元素在同辈中的索引位置
			return jQuery.inArray( this[0], elem ? jQuery( elem ) : this.parent().children() );
		}
		//如果是jQuery 对象则从[0]查找,否则当作对象处理
		return jQuery.inArray( elem.jquery ? elem[0] : elem, this );
	}
});
jQuery.fn.init.prototype = jQuery.fn;
jQuery.extend = jQuery.fn.extend = function() {}
jQuery.extend({
	each: function( object, callback, args ) {//$.each,参数args仅在内部使用
		var name, i = 0,
			length = object.length,
			isObj = length === undefined || jQuery.isFunction(object);//这里用length 区分是对象还是数组(对象没有length 属性)
		if ( args ) {//如果args 有值
			if ( isObj ) {//如果是对象
				for ( name in object ) {
					if ( callback.apply( object[ name ], args ) === false ) {
						break;
					}
				}
			} else {//如果是数组
				for ( ; i < length; ) {
					if ( callback.apply( object[ i++ ], args ) === false ) {
						break;
					}
				}
			}
		} else {
			if ( isObj ) {
				for ( name in object ) {
					if ( callback.call( object[ name ], name, object[ name ] ) === false ) {
						break;
					}
				}
			} else {
				for ( var value = object[0];
					i < length && callback.call( value, i, value ) !== false; value = object[++i] ) {}
			}
		}
		return object;
	},
	inArray: function( elem, array ) {
		if ( array.indexOf ) {//如果 array 有indexOf 属性直接使用
			return array.indexOf( elem );
		}
		for ( var i = 0, length = array.length; i < length; i++ ) {
			if ( array[ i ] === elem ) {
				return i;//返回所处位置,
			}
		}
		return -1;//返回-1 表示不存在
	}
})