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

2022-01-14 19:46:22 字數 2947 閱讀 2000

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;

}

2、**驗證

(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 擴...