jQuery物件擴充套件方法 Extend 深度解析

1、這幾天在寫自己的js工具類庫,所以在編寫物件擴充套件方法,參考了jquery的物件擴充套件方法,在編寫該方法前,需要掌握js深拷貝和淺拷貝的相關知識,下面是jquery3.2.1版本物件擴充套件方法的原始碼:

jquery.extend = jquery.fn.extend = function

() ,
i = 1,
length =arguments.length,
deep = false
; 
//handle a deep copy situation
if ( typeof target === "boolean") ;
i++;
}//handle case when target is a string or something (possible in deep copy)
if ( typeof target !== "object" && !jquery.isfunction( target ) ) ;
}//extend jquery itself if only one argument is passed
if ( i ===length ) 
for ( ; i < length; i++) 
//recurse if we're merging plain objects or arrays
if ( deep && copy && ( jquery.isplainobject( copy ) ||( copyisarray =array.isarray( copy ) ) ) ) 
else
; }
//never move original objects, clone them
target[ name ] =jquery.extend( deep, clone, copy );
//don't bring in undefined values
} else
if ( copy !==undefined ) }}
}//return the modified object
return
target;
};

zchtmlhelper.extend=zchtmlhelper.fn.extend=function

(),//
第乙個引數
deep = false,//
是否開啟深拷貝功能,預設不是
i=1,
length=arguments.length,
options,
name,
src,
copy,
copyisarray,
clone;
//處理深拷貝場景
if(typeof target==="boolean");//
將緊隨其後的存放拷貝值的集合
i++;//
加1的原因是,一旦開啟深拷貝功能,那麼傳入的引數就至少有兩個,乙個是深拷貝的開關另乙個是擴充套件引數,否則當隻傳如乙個深拷貝的開關,那麼方法將返回空集合
} 
if(typeof target!=="object");
}//這個判斷有兩種情況
//1、當傳入的引數只有乙個(不能是true或者false),那麼就擴充套件當前命名空間
//2、當傳入的引數有個兩個,分別是深拷貝的開關(true或者false)和擴充套件引數,那麼就擴充套件當前命名空間
if(i==length)
for(;i)
//如果傳入的合併物件裡面巢狀陣列或者物件,那麼遞迴擴充套件物件
if(deep && copy && (zchtmlhelper.isplainobject(copy) || (copyisarray =array.isarray(copy))))
else
; }
target[ name ] =zchtmlhelper.extend( deep, clone, copy );
}else
if(copy!=undefined)}}
}return
target;
}

(1)、淺拷貝**:

首先物件拷貝成功,settings是兩個物件的合集,但是name陣列物件和settings.name屬性是同乙個引用,所以,這是前拷貝

(2)、深拷貝**:

jQuery物件擴充套件方法 Extend 深度解析

1 這幾天在寫自己的js工具類庫,所以在編寫物件擴充套件方法,參考了jquery的物件擴充套件方法,在編寫該方法前,需要掌握js深拷貝和淺拷貝的相關知識,下面是jquery3.2.1版本物件擴充套件方法的原始碼 jquery.extend jquery.fn.extend function i 1,...

Jquery 擴充套件方法

好久沒有溫習js了。最近看到vs2010把jquery作為js標準庫納入了web專案裡，再不會用jquery，真怕自己 out 了。於是翻出了前年的jquery中文文件。大致瀏覽了下jquery的方法。發現jquery如此之強大，怎麼以前就沒有發現呢？於是就親手寫了基於jquery的擴充套件函式，如...

jquery新增擴充套件方法

jquery提拱兩個方法開發外掛程式 jquery.fn.extend object jquery.fn jquery.prototype jquery.extend object jquery.fn.extend object 為jquery物件新增方，jquery.extend object 擴...