jQuery中的extend方法

2021-07-24 06:44:53 字數 2177 閱讀 1914

jquery

中的extend方法jquery中的extend方法通過不同的引數實現了幾種不同的繼承方法:

* 1.extend(src) 

將src物件的屬性和方法逐一複製給jquery或jquery物件

* 2.extend(dest,src1,src2,src3...srcn) 

將 src1、src2...物件的屬性和方法逐一複製給dest物件,需要注意的是,在複製的過程中,排在後面的引數(物件)將會覆蓋排在前面的引數的屬性和方法;實際上,該方法和後面的方法3都提供了一種「深度繼承」的方法,即:引數一表示的物件可以通過該方法一次實現逐一按層次的父類繼承。 

如下圖所示: 

srcn 

... 

src3 

src2 

src1 

dest 

使用該方法,可以一次將」繼承「dest的多個父類,需要注意的是src3提供的屬性和方法由可能會被src2,src1過載。

* 3.extend(boolean,dest,src1,src2...) 

與其他的類庫不同的是,jquery的extend方法提供了「深層拷貝」的功能,如果你傳入的第乙個引數為boolean型變數,則該變數為深層拷貝的標誌,第二個引數為extend方法的目標物件,其餘引數為需要進行繼承的「父類」。如果第乙個引數的值為true(深層拷貝),並且dest和src元素都包括相同名稱的物件屬性,則對該物件屬性的方法和屬性再進行一次複製。

* 最後我們來通過分析源**,來加深對該繼承機制的理解:

jquery.extend = jquery.fn.extend = function() , i = 1, length = arguments.length, deep = false, options;

// handle a deep copy situation  /*如果第乙個引數為boolean值,則取第二個引數為目標物件*/

if ( target.constructor == boolean ) ;

// skip the boolean and the target

i = 2;

}// handle case when target is a string or something (possible in deep copy)

/*如果目標引數不是object或者function,那麼就有可能是深度copy,*/

if ( typeof target != "object" && typeof target != "function" )

target = {};

// extend jquery itself if only one argument is passed /*如果引數長度為1,則將引數表示的物件的屬性和方法復  製給jquery本身*/

if ( length == i )

for ( ; i < length; i++ )

// only deal with non-null/undefined values當引數都為非空時,

if ( (options = arguments[ i ]) != null )

// extend the base object

for ( var name in options ) )

, copy );

// don't bring in undefined values  /*正常情況下的繼承實現*/

else if ( copy !== undefined )

target[ name ] = copy;

}// return the modified object

return target;

};* 注意:

在這裡還有乙個特殊的地方,就是在函式開頭的地方有jquery.extend = jquery.fn.extend,而在程式的前面已經將jquery.prototype賦值給jquery.fn了,所以在後面的呼叫中會出現 jquery.extend()和jquery.fn.extend()的不同呼叫,這兩個方法呼叫產生的結果也不一樣,jquery.extend() 的呼叫並不會把方法擴充套件到物件的例項上,引用它的方法也需要通過jquery類來實現,如jquery.init(),而 jquery.fn.extend()的呼叫把方法擴充套件到了物件的prototype上,所以例項化乙個jquery物件的時候,它就具有了這些方法,這是很重要的,在jquery.js中到處體現這一點

jquery中的extend 方法

通常我們使用jquery的extend 方法時,大都是為了實現預設欄位的覆蓋,即若傳入某個欄位的值,則使用傳入值,否則使用預設值。function getopt option extend default,option return default getopt getopt getopt exte...

jQuery中的 extend 方法使用

extend 函式用於將乙個或多個物件的內容合併到目標物件 用法1 只有乙個引數,表示將該引數新增到全域性物件jquery中,可以用 來獲取值。測試1 1 extend alert test 彈出框會顯示100 測試1 2 var fun function i extend test 200 彈出框...

Jquery中extend使用技巧

在使用jquery開發的過程中,extend是常用的引數處理函式,特別是對預設值的使用。jquery的擴充套件方法原型是 var v extend dest,src1,src2,src3.作用是把src1,src2,src3合併到到dest中並返回合併後的dest.但是在使用過程中,預設值往往是不能...