jQuery.extend函数解析


 前言
jQuery.extend函数是jQuery的核心函数之一,在官方API文档视图中它位于core栏目下的plugins中。顾名思义,extend函数的主要目的就是用来扩展jQuery的功能。因此如果需要基于jQuery编写插件,那么掌握这个函数是必不可少的。不仅如此,jQeury内部许多函数和方法都离不开它,足以证明jQuery.extend的重要性。

功能
合并一个或多个对象的属性到目标对象
使用
jQuery.extend ( [deep] , target , source1 , source2 , ...[sourceN] );
参数说明
deep指定是深拷贝-true还是浅拷贝-false(是否使用递归),默认是浅拷贝
target是目标对象
source属性来源参数,用于扩展目标对象
额外说明:如果只有一个参数则直接扩展jQuery对象
返回值
返回改动过的目标对象target,如果希望保留目标对象,则将target设为一个空对象,将希望保留的对象作为source传入。
源代码(1.6.2)

jQuery.extend = jQuery.fn.extend = function() {
    
var options, name, src, copy, copyIsArray, clone,
        target 
= arguments[0|| {},
        i 
= 1,
        length 
= arguments.length,
        deep 
= false;
    
// 判断是否是深拷贝
    if ( typeof target === "boolean" ) {
        deep 
= target;
        target 
= arguments[1|| {};
        
// 从第2个参数开始扩展目标对象
        i = 2;
    }
    
// 如果目标参数不是对象或者函数则使用空对象代替
    if ( typeof target !== "object" && !jQuery.isFunction(target) ) {
        target 
= {};
    }
    
//如果只有一个参数则扩展jQuery
    if ( length === i ) {
        target 
= this;
        
--i;
    }
    
for ( ; i < length; i++ ) {
        
//忽略等于null和undefined的来源参数
        if ( (options = arguments[ i ]) != null ) {
            
//如果options是数组则name成为“0”,“1”,“2” ...
            for ( name in options ) {
                
//目标对象属性值
                src = target[ name ];
                
//来源参数对象属性值
                copy = options[ name ];
                
//恒等则处理下一个属性
                if ( target === copy ) {
                    
continue;
                }

                
// 当使用深拷贝且属性值是对象或者数组的时候需要递归处理
                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 : {};
                    }
                    
//使用递归合并属性
                    target[ name ] = jQuery.extend( deep, clone, copy );
                } 
else if ( copy !== undefined ) {//浅拷贝直接覆盖
                    target[ name ] = copy;
                }
            }
        }
    }
    
return target;
};
额外说明:jQuery使用JavaScript的语言特性for..in巧妙地将对象和数组使用几乎相同的方式进行了处理。处理逻辑就是类似于MongoDB中的Upsert,如果均有此属性,则用来源参数覆盖;如果目标对象没有则加入。
原文地址:https://www.cnblogs.com/1000/p/2162468.html