jQuery.extend関数および使い方の詳細

jquery.extend関数の詳細
JQueryのextend拡張方法:
Jqueryの拡張方法extendは、プラグインを書くときによく使われる方法で、いくつかのリロードプロトタイプがあります.ここでは、一緒に理解してみましょう.
一、Jqueryの拡張方法の原型は:

extend(dest,src1,src2,src3...);

src 1,src 2,src 3を...destにマージし、戻り値がマージ後のdestであることから、このメソッドがマージされた後、destの構造が変更されたことがわかります.マージの結果を取得したいのにdestの構造を変更したくない場合は、次のように使用します.

var newSrc=$.extend({},src1,src2,src3...)//    "{}"  dest  

これでsrc 1,src 2,src 3...マージを行い、マージ結果をnewSrcに返します.次の例を示します.

var result=$.extend({},{name:"Tom",age:21},{name:"Jerry",sex:"Boy"})

では、合併後の結果

result={name:"Jerry",age:21,sex:"Boy"}

つまり、後のパラメータが前のパラメータと同じ名前である場合、後のパラメータは前のパラメータ値を上書きします.
二、destパラメータの省略
上記のextendメソッドのプロトタイプのdestパラメータは省略できますが、省略すると、このメソッドにはsrcパラメータが1つしかなく、extendメソッドを呼び出すオブジェクトにsrcをマージすることができます.
1、$.extend(src)
この方法は、srcをjqueryのグローバルオブジェクトにマージすることです.たとえば、次のようにします.

 $.extend({
 hello:function(){alert('hello');}
 });

helloメソッドをjqueryのグローバルオブジェクトにマージします.
2、$.fn.extend(src)
このメソッドは、srcをjqueryのインスタンスオブジェクトにマージします.たとえば、次のようにします.

 $.fn.extend({
 hello:function(){alert('hello');}
 });

helloメソッドをjqueryのインスタンスオブジェクトにマージします.
次に、一般的な拡張例をいくつか示します.

$.extend({net:{}});

これはjqueryグローバルオブジェクトにnetネーミングスペースを拡張します.

 $.extend($.net,{
  hello:function(){alert('hello');}
 })

これはhelloメソッドを以前に拡張したJqueryのnetネーミングスペースに拡張します.
三、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"} } );

src 1にはサブオブジェクトlocation:{city:"Boston"}が埋め込まれており、src 2にもサブオブジェクトlocation:{state:"MA"}がネストされており、最初の深さコピーパラメータはtrueであり、マージ後の結果は次のようになります.

result={name:"John",last:"Resig",
    location:{city:"Boston",state:"MA",county:"China"}}

すなわち、srcのネストされたサブオブジェクトもマージされます.最初のパラメータbooleanがfalseの場合、マージの結果を見てみましょう.次のようにします.

var result=$.extend( false, {}, 
{ name: "John", location:{city: "Boston",county:"USA"} }, 
{ last: "Resig", location: {state: "MA",county:"China"} } 
          ); 

では、統合の結果は次のとおりです.

 result={name:"John",last:"Resig",location:{state:"MA",county:"China"}}

以上が$です.extend()は、プロジェクトでよく使用される詳細です.
補足:extend()メソッドを使用してjqueryプラグインを作成することもよくありますが、jqueryプラグインの種類は次のとおりです.
jQueryプラグインの種類
1、オブジェクトをカプセル化する方法このプラグインはオブジェクト方法をカプセル化し、セレクタで取得したjQueryオブジェクトを操作するための最も一般的なプラグインである.このようなプラグインはjQueryセレクタの強力な利点を発揮することができ、かなりの部分のjQueryの方法があり、jQueryスクリプトライブラリの内部でこのような形式でカーネルに「挿入」されている.例えばparent()方法、appendTo()方法などである.
2.パッケージグローバル関数は、jQueryネーミングスペースに独立した関数を追加することができる.よく使うjQuery.ajax()メソッド、先頭と末尾のスペースをとるjQuery.trim()メソッドは,いずれもjQuery内部でグローバル関数のプラグインとしてカーネルに付加されている.
3、セレクタプラグインjQueryのセレクタは非常に強いが、少数の場合、セレクタプラグインを使って自分の好きなセレクタを拡張する必要がある.
jQuery.fn.extend()は、前述の3つのタイプのうちの1つ目、jQueryを拡張するために使用されることが多い.extend()は、拡張後の2つのプラグインに使用されます.どちらのメソッドも、Objectタイプのパラメータを受け入れます.Objectオブジェクトの「名前/値ペア」は、それぞれ「関数またはメソッド名/関数本体」を表します.
jquery.extend関数の使い方の詳細
最近jQueryを研究しています.jQuery.extend拡張関数の使い方を記録します.
1、jQueryの静的方法を拡張する.

$.extend({
test:function(){alert('test  ')}
})

使用法:$.test()
2、複数のオブジェクトを結合する
jQuery.extend(css 1,css 2)を例にとると、css 1,css 2にはいくつかの属性がある(法は処理よりも処理され、ここでは属性).extend関数はcss 2にあり、css 2にない属性をcss 1に追加し、css 2の属性がcss 1の属性名と共有されると、css 2の属性でcss 1の同名属性を上書きします.css 1は最後の整和オブジェクトです.または、

var newcss = jquery.extend(css1,css2) newcss        。


var newcss = jquery.extend({},css1,css2) newcss        .      css1   。

//  : jQuery.extend(obj,obj,obj,..)
var Css={size: "px",style: "oblique"}
var Css={size: "px",style: "oblique",weight: "bolder"}
$.jQuery.extend(Css,Css)
//  :Css size     ,     Css weight  
// Css = {size: "px",style: "oblique",weight: "bolder"}

3.深さインサートオブジェクト
新しいextend()を使用すると、インサートオブジェクトをより深くマージできます.次の例は良い証明です.

 //     .extend()  
  jQuery.extend(  
   { name: “John”, location: { city: “Boston” } },  
   { last: “Resig”, location: { state: “MA” } }  
  );  
   //   :  
   // => { name: “John”, last: “Resig”, location: { state: “MA” } }
  //        .extend()  
  jQuery.extend( true,  
  { name: “John”, location: { city: “Boston” } },  
   { last: “Resig”, location: { state: “MA” } }  
 );  
 //     
  // => { name: “John”, last: “Resig”,  
 //   location: { city: “Boston”, state: “MA” } }