jQuery-extend分析

jQuery.extend = jQuery.fn.extend = function() {
	var options, name, src, copy, copyIsArray, clone,
		target = arguments[0] || {},
		i = 1,
		length = arguments.length,
		deep = false;

	// Handle a deep copy situation
	if ( typeof target === "boolean" ) {
		deep = target;
		target = arguments[1] || {};
		// skip the boolean and the target
		i = 2;
	}

	// Handle case when target is a string or something (possible in deep copy)
	if ( typeof target !== "object" && !jQuery.isFunction(target) ) {
		target = {};
	}

	// extend jQuery itself if only one argument is passed
	if ( length === i ) {
		target = this;
		--i;
	}

	for ( ; i < length; i++ ) {
		// Only deal with non-null/undefined values
		if ( (options = arguments[ i ]) != null ) {
			// Extend the base object
			for ( name in options ) {
				src = target[ name ];
				copy = options[ name ];

				// Prevent never-ending loop
				if ( target === copy ) {
					continue;
				}

				// Recurse if we're merging plain objects or arrays
				if ( deep && copy && ( jQuery.isPlainObject(copy) || (copyIsArray = jQuery.isArray(copy)) ) ) {
					if ( copyIsArray ) {
						copyIsArray = false;
						clone = src && jQuery.isArray(src) ? src : [];

					} else {
						clone = src && jQuery.isPlainObject(src) ? src : {};
					}

					// Never move original objects, clone them
					target[ name ] = jQuery.extend( deep, clone, copy );

				// Don't bring in undefined values
				} else if ( copy !== undefined ) {
					target[ name ] = copy;
				}
			}
		}
	}

	// Return the modified object
	return target;
};


extend,可以用于jq自身的扩展,也可以用于对象拷贝

使用方法:

1、给JQ扩展方法


2、对象的浅拷贝




3、对象的深拷贝


ps:拷贝的参数可以有多个,如 $.extend(a,b,c,d...)

a后面的全部拷贝给a


代码分析:

var options, name, src, copy, copyIsArray, clone,

options:arguments参数

name:枚举k值

src:以上示例中的a.a,当a.a不存在,则为undefined

copy:以上实例中的b.b

copyIsArray:用来判断是不是数组

clone:对src的复制


1、对自身的拓展

target = arguments[0] || {},
i = 1,
length = arguments.length,
deep = false;

target:要赋值的对象


对自身的拓展,length肯定为1,和初始设置的i相等,则把i设置为0,后面for循环一次;

if ( length === i ) {
target = this;
--i;
}


for循环直接走这里

if ( copy !== undefined ) {
target[ name ] = copy;
}


2、浅拷贝

第一个参数boolean设置为false,因为执行代码执行默认为浅拷贝:deep=false,第一个参数省略。传入参数至少为2个以上,$.extend(a,b,c,d...)

//这个判断是为了格式化无效参数

if ( typeof target !== "object" && !jQuery.isFunction(target) ) {
target = {};
}


for循环里面走的流程和对自身拷贝一样


3、深拷贝

第一个参数肯定为true,for循环索引变为从2开始,索引1的值的赋值的对象,上列中的a。

if ( typeof target === "boolean" ) {
deep = target;
target = arguments[1] || {};
// skip the boolean and the target
i = 2;
}


for ( name in options ) {
src = target[ name ];
copy = options[ name ];


// Prevent never-ending loop
if ( target === copy ) {//当赋值的对象和被拷贝的值为同一个对象,跳出
continue;
}


// Recurse if we're merging plain objects or arrays

//深拷贝 && copy有值 && copy为{}  / new Object对象或者数组
if ( deep && copy && ( jQuery.isPlainObject(copy) || (copyIsArray = jQuery.isArray(copy)) ) ) {

if ( copyIsArray ) {
copyIsArray = false;

//如果为数组,则对该数组进行引用,用来保存原来的值,为空组则赋值[]
clone = src && jQuery.isArray(src) ? src : [];


} else {

//如果为{}对象,则对该对象进行引用,用来保存原来的值,为则赋值{}
clone = src && jQuery.isPlainObject(src) ? src : {};
}


// Never move original objects, clone them

//这一步很关键,自调用,递归拷贝,成功复制,防止了对同一对象的共同引用情况
target[ name ] = jQuery.extend( deep, clone, copy );


// Don't bring in undefined values
} else if ( copy !== undefined ) {
target[ name ] = copy;
}
}


对arguments参数的判断然后分别做出执行,这种方法很值得学习。


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值