ホームページ >ウェブフロントエンド >jsチュートリアル >jQuery パート 2 (2 つの拡張機能)_jquery を読む

jQuery パート 2 (2 つの拡張機能)_jquery を読む

WBOY
WBOYオリジナル
2016-05-16 18:05:54951ブラウズ

以下のように

コードをコピーします コードは次のとおりです:

jQuery.extend = jQuery。 fn.extend = function () {
...
};

$.extend を使用して、
などのカスタム オブジェクトを拡張できます。 コードをコピーします コードは次のとおりです:

var self = {name:jack}; {setName: function(n) {this.name=n;} });
myself.setName("tom");

$ を通じて setName メソッドがオブジェクトに追加されます。伸ばす。ただし、ここでは主に $.extend が jQuery ライブラリを構築する方法について説明します。上記のコードの jQuery.extend と jQuery.fn.extend が同じ関数であるとは知りませんでした。 jQuery ライブラリを参照したところ、一部のメソッドは jQuery.extend を呼び出すことによって拡張され、一部のメソッドは jQuery.fn.extend を呼び出すことによって拡張されていることがわかりました。
以下で個別に説明します:
1. jQuery.extend による拡張
jQuery.extend の jQuery 型は function、つまり jQuery 値の type は文字列「function」であることがわかります。 jQuery をクラスとみなした場合、jQuery.extend はクラスに静的メソッド extend を追加することに相当します。静的メソッドは、新しいインスタンスを呼び出す必要はありません。「クラス名 + メソッド名」を通じて直接呼び出されます。つまり、jQuery.extend(...)、$にjQueryが代入されます。したがって、$.extend(...) の方が慣れています。
jQuery.extend メソッドはソース コード内で直接呼び出され、パラメーターを 1 つだけ渡します。以下のように

コードをコピーします コードは次のとおりです。
jQuery.extend({
noConflict: function ( deep ) {
window.$ = _$;
if ( deep )
window.jQuery = _jQuery;
return
},
。 ..
});

extend でパラメータが 1 つだけ渡された場合、この文が実行されることがわかっています

コードをコピーします コードは次のとおりです。
if ( length === i ) {
target = this; 🎜>}


つまり、自分自身を拡張したもので、これが関数 jQuery です。つまり、多くの静的メソッドが関数 jQuery に追加されています。これらのメソッドは、最初に jQuery メソッドを実行 (呼び出し) してから xx を呼び出すのではなく、jQuery.xx (または $.xx) を通じて直接呼び出すことができます ($( など)。 "# id").xx。次の例の方が理解しやすいかもしれません


コードをコピーします コードは次のとおりです: function fun(){ }//クラス (function) を定義します
//静的メソッドを追加します extend
fun.extend=function(obj){
for(var a in obj)
this [a] = obj[a];//注意: ここは楽しいです
}
//extend を呼び出すと、静的属性名がクラスに追加され、静的メソッド method1
fun.extend({ name:"fun",method1:function(){}});
//出力名、プロトタイプ、extend、method1
console.dir(fun)


したがって、jQuery isFunction、isArray、isWindow などはすべて静的メソッドであり、$.isFunction、$.isArray、$.Window を通じてのみ参照できます。 $("...").isFuction、$("...").isArray、$("...").isWindow を通じて参照することはできません。
2、jQuery.fn.extend による拡張
jQuery.fn は jQuery.prototype と等しく、これは関数 jQuery のプロトタイプに extend メソッドが付加されていることを意味します。 jQuery.fn.extend(object) を呼び出して拡張する場合 (パラメーター オブジェクトが 1 つだけ渡されることに注意してください)、extend 関数は引き続き



Copy code コードは次のとおりです。 if ( length === i ) { target = this;
}


現時点では、これは jQuery.prototype です (最初に言及されているのは jQuery 関数自体です)。つまり、多くの属性とメソッドが jQuery.prototype に追加されます。 $() や jQuery() などの jQuery 関数が実行されるときは、$() が実行されることが多くなります。この関数は新しい jQuery を作成します (jQuery オブジェクトの構成については前の記事を参照してください)。このとき、newで生成したオブジェクトには拡張属性やメソッドが付加されます。次の例の方が理解しやすいかもしれません



コードをコピーします
声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。