JQuery の extend メソッド:
JQuery の extend メソッドは、プラグインを作成するときによく使用されるメソッドです。このメソッドにはいくつかのオーバーロードされたプロトタイプがあります。ここでは、それについて一緒に学びましょう。
1. Jquery の拡張メソッドのプロトタイプは次のとおりです:
extend(dest,src1,src2,src3...);
これは src1、src2、src3... を dest にマージすることを意味し、戻り値は merge dest です。メソッドがマージされた後、dest の構造が変更されていることがわかります。マージされた結果を取得したいが、dest 構造を変更したくない場合は、次のように使用できます:
var newSrc=$.extend({},src1,src2,src3...)//Thatつまり、dest パラメータとして「{}」を使用します。
このようにして、src1、src2、src3... をマージし、マージされた結果を newSrc に返すことができます。例として:
var result=$.extend({},{name:"Tom",age:21},{name:"Jerry",sex:"Boy"})
次に、マージされた結果
result={name:"Jerry",age:21,sex:"Boy"}
つまり、後のパラメータが前のパラメータと同じ名前を持つ場合、後のパラメータは前のパラメータ値を上書きします。
2. dest パラメータを省略します
上記の extend メソッドのプロトタイプの dest パラメータは省略できます。省略した場合、
メソッドは src パラメータを 1 つだけ持つことができ、src は extend を呼び出すオブジェクトにマージされます。
1. $.extend(src)
このメソッドは、次のように src を jquery のグローバル オブジェクトにマージします。
$.extend({ hello:function(){alert('hello') );}
});
jqueryのグローバルオブジェクトにhelloメソッドをマージすることです。
2. $.fn.extend(src)
このメソッドは、次のように src を jquery インスタンス オブジェクトにマージします:
$.fn.extend({
hello:function() {alert('hello');}
} );
一般的に使用される拡張の例をいくつか示します:
$.extend({net:{}});
これは、jquery グローバル オブジェクトの net 名前空間を拡張します。
$.extend($.net,{
hello:function(){alert('hello');}
})
これは、hello メソッドを以前に展開された Jquery net 名前空間に拡張することです。
3. Jquery の extend メソッドにもオーバーロードされたプロトタイプがあります:
extend(boolean,dest,src1,src2,src3...)
最初のパラメータ boolean はディープ コピーを実行するかどうかを表し、残りのパラメータは次のとおりです。前に説明した一貫性のある、
ディープ コピーとは何ですか? 例を見てみましょう:
var result=$.extend( true, {},
{ name: "John", location: {city: "Boston",county: "USA"} },
{ last: "Resig", location: {state: "MA",county:"China"} } );
ネストされたサブオブジェクト location: {city: "Boston" であることがわかります。 },
in src1 サブオブジェクトの場所: {state: "MA"} は src2 にもネストされています。最初のディープ コピー パラメーターは true、
マージ後の結果は次のようになります:
result={name: "John" 、最後: "Resig",
Location:{city:"Boston",state:"MA",county:"China"}}
つまり、src 内のネストされたサブオブジェクトもマージされます
そして、最初のパラメータはブール値です。 false の場合は、次のように結合の結果を見てみましょう:
var result = $. Extend (false, {},
{name: "john", local: {city: "boston") 、郡: "米国" } }、
{ last: "Resig", location: {state: "MA",county:"China"} }
)
合併後の結果は次のようになります:
result={name: "John", last: "Resig" , location:{state:"MA",county:"China"}}
上記は$.extend()がプロジェクトでよく使われる内容の一部です。