jquery extend源码解析

		$.extend(obj1,0bj2,{"name":"s","age":22})
		//target  要拷贝到哪个对象上
		// i  要执行拷贝的次数
		// length  要拷贝的参数的长度
		// name 对象参数中属性值
		// options 对象参数
		// clone 深度拷贝时重名对象属性的拷贝
		// target 要拓展的对象

		jQuery.extend = jQuery.fn.extend = function() {
	    var src, copyIsArray, copy, name, options, clone,
	        target = arguments[0] || {},    // 常见用法 jQuery.extend( obj1, obj2 ),此时,target为arguments[0]
	        i = 1,
	        length = arguments.length,
	        deep = false;

	    // Handle a deep copy situation
	    if ( typeof target === "boolean" ) {    // 如果第一个参数为true,即 jQuery.extend( true, obj1, obj2 ); 的情况
	        deep = target;  // 此时target是true
	        target = arguments[1] || {};    // target改为 obj1
	        // skip the boolean and the target
	        i = 2;
	    }
	    // 以上处理:如果第一个参数是boolean,第二个参数是target。
	    // Handle case when target is a string or something (possible in deep copy)
	    if ( typeof target !== "object" && !jQuery.isFunction(target) ) {  // 如果target不是一个对象,设置默认对象。
	        target = {};
	    }

	    // extend jQuery itself if only one argument is passed
	    if ( length === i ) {   // 处理这种情况 jQuery.extend(obj),或 jQuery.fn.extend( obj )
	        target = this;  // jQuery.extend时,this指的是jQuery;jQuery.fn.extend时,this指的是jQuery.fn
	        --i;
	    }

	    for ( ; i < length; i++ ) {
	        // Only deal with non-null/undefined values
	        if ( (options = arguments[i]) != null ) { // 比如 jQuery.extend( , obj2, obj3, ojb4 ),options则为 obj2、obj3...
	            // Extend the base object
	            for ( name in options ) {
	                src = target[ name ];
	                copy = options[ name ];

	                // Prevent never-ending loop
	                if ( target === copy ) {    // 防止自引用:$.extend(x,{"name1":x});如果  如果target和option[name1]的值一样,会循环迭代。
	                //看网上还有说应该要用src和copy比较的,$.extend({"name1":"张三","age":"14"},{"name1":"李四","age":"14"}),这两个可以进行操作的。
	                    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 {    //被拷贝的属性值是个plainObject,比如{ nick: ‘casper‘ }
	                        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 ) {  // 浅拷贝,且属性值不为undefined
	                    target[ name ] = copy;
	                }
	            }
	        }
	    }

	    // Return the modified object
	    return target;

	{
		name1:"sdasd",
		"name2":{
				name1:"sdasd",
				"name2":{
					name1:"sdasd",
					"name2":{
							name1:"sdasd",
							"name2":{
								name1:"sdasd",
								"name2":{
										name1:"sdasd",
										"name2":{
											name1:"sdasd",
											"name2":{
													name1:"sdasd",
													"name2":
													}
												}
										}
									}
							}
						}
				}
	}

  

时间: 2024-08-05 22:10:16

jquery extend源码解析的相关文章

jQuery方法源码解析--jQuery($)方法(一)

jQuery方法源码解析--jQuery($)方法 注: 1.本文分析的代码为jQuery.1.11.1版本,在官网上下载未压缩版即可 2.转载请注明出处 jQuery方法: 这个方法大家都不陌生,在使用过程中,它还有另外一个名字,美元符号:$,$(...)其实就是jQuery(...); 它有很多种用法,通常都返回一个jquery对象,也可以作为$(document).ready(...);的简写形式,分析之前先看一下jQuery都有什么用法. 1.jQuery( selector [, co

jQuery.extend源码深层分析

在网站的开发中,经常会自己写一些jQuery插件来方便使用,其中自然少不了一个关键的方法->jQuery.extend(),使用这个方法来扩展jQuery对象. 那么今天就来讲讲这个函数的实现原理. 这个方法不仅仅可以实现插件,当然也有它本来的功能,扩展对象.like this: var person = {name:'李四'}; var person2 = $.extend(person,{age:20},{sex:'male'}); //person.name='李四'; //person.

jQuery.extend() 源码分析

jQuery.extend() 方法 可以合并对象 深拷贝与浅拷贝 源码分析: 概述:  1. 首先定义变量 options:保存每次循环遍历的arguments[i] , name: 保存循环遍历对象的key值 src:保存目标对象target的属性 copy: 保存合并对象的属性 copyIsArray: 如果copy是数组,用copyIsArray保存 clone:如果目标对象是数组,用clone保存. target:目标对象 deep: boolean值,判断是否是深拷贝 2. 然后判断

jQuery.extend()源码解读

// extend方法为jQuery对象和init对象的prototype扩展方法// 同时具有独立的扩展普通对象的功能jQuery.extend = jQuery.fn.extend = function() { /* *target被扩展的对象 *length参数的数量 *deep是否深度操作 */ var options, name, src, copy, copyIsArray, clone, target = arguments[0] || {}, i = 1, length = ar

jQuery offset()源码解析

首先是原型上的offset方法,根据arguments判断到底是取值还是设值.如果是设置,就遍历调用静态方法jQuery.offset.setOffset 如果是取值.那么就是从"var docElem,win"这里开始了. jQuery.fn.offset = function( options ) { if ( arguments.length ) {//设置元素坐标 return options === undefined ?//如果传入的参数是undefined,直接返回 th

五.jQuery源码解析之jQuery.extend(),jQuery.fn.extend()

给jQuery做过扩展或者制作过jQuery插件的人这两个方法东西可能不陌生.jQuery.extend([deep],target,object1,,object2...[objectN]) jQuery.fn.extend([deep],target,object1,,object2...[objectN])这两个属性都是用于合并两个或多个对象的属性到target对象.deep是布尔值,表示是否进行深度合并,默认是false,不执行深度合并.通过这种方式可以在jQuery或jQuery.fn

jquery源码解析:jQuery对元素属性的操作2

这一课,我们将继续讲解jQuery对元素属性操作的方法. 首先,我们先看一下这几个方法是如何使用的: $("#div1").addClass("box1 box2");     //给元素div的class属性添加box1和box2 $("#div1").removeClass("box1");     //删除元素div的class属性值box1 $("#div1").toggleClass("

jquery源码解析:jQuery工具方法Callbacks详解

我们首先来讲下Callbacks是如何使用的:第一个例子 function a(){} function b(){} var cb = $.Callbacks(); cb.add(a); cb.add(b); cb.fire();      //就会先执行a方法,再执行b方法 上面大概的意思是:add方法,就是把方法添加到数组list中,每执行一次,就添加一个方法.而fire方法,就是把list数组中的方法按顺序执行. 使用场景:第二个例子 function a(n){ } (function(

jquery源码解析:代码结构分析

本系列是针对jquery2.0.3版本进行的讲解.此版本不支持IE8及以下版本. (function(){ (21, 94)     定义了一些变量和函数,   jQuery = function(){}; (96,283)   给jQuery对象添加一些属性和方法(实例方法,通过$("div")这类的jQuery实例对象来调用) (285,347)   extend : jQuery的继承方法 (349,817)   jQuery.extend():扩展一些工具方法(静态方法,直接通