jQueryの各メソッドについて(jQueryは何をするのか)_jquery

1. jQuery の各メソッドを使用する人が多いと予想されます。

それでは、jQuery が何をしたかを見てみましょう。

jquery でそれぞれのソース コードを見つけます:

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

each: function( object, callback, args ) {
var name, i = 0,
length = object.length,
isObj = length === 未定義 || .isFunction( object );

if ( args ) {
if ( isObj ) {
for ( object の名前 ) {
if ( callback.apply( object[ name ], args ) === false ) {
break;
}
}
} else {
for ( ; i < length; ) {
if ( callback.apply( object[ i ], args ) = == false ) {
break;
}
}
}

// 各 < の最も一般的な使用のための、特別で高速なケース🎜>} else {
if ( isObj ) {
for ( object 内の name ) {
if ( callback.call( object[ name ], name, object[ name ] ) === false ) {
break;
}
}
} else {
for ( ; i < length; ) {
if ( callback.call( object[ i ], i, object[ i ] ) === false ) {
ブレーク;
}
}
}

オブジェクトを返す;
このコードは比較的単純なので問題ありません。

これをテストするために、次の js を書きました。

コピーcode

コードは次のとおりです: $.each($(".demo"),function(){ console.log("show "); });

次に、HTML を追加します:

コードをコピーします

コードは次のとおりです:

そして、jQuery ソース コードをデバッグに使用して、次のように考えました。正しい結果を得ることができました。しかし、残念です。


ご覧のとおり、ここでのオブジェクトは、必要な 3 つの HTML オブジェクトではなく、js の 8 つの組み込みデータ型です。

の後に、jquery ソース コードにコードを追加しました。



コードをコピーします

コードは次のとおりです。 console.log(Object.prototype.toString(object)); console.log(length); の後の入力は次のとおりです。

つまり、ドキュメントがロードされると、

が使用されていない場合でも、jQuery は dom オブジェクトを走査するために each を使用します。
コードをコピーします

コードは次のとおりです:

$(function(){ });指定されたオブジェクトを走査した後も、バブリングは引き続き親要素を走査します。 2. jQuery ソース コードに従ってコールバック関数のパラメーターを使用します

コードをコピーします

コードは次のとおりです。


$.each($(".demo"),function(a,b){

console.log(a "" $(a)​​.attr("class")) ; } ) ソースコードから確認できます:

コードをコピーします


コードは次のとおりです。

callback.call( object[ i ], i, object[ i ] )

最後に、現在のオブジェクトがコールバックに渡されます。 call メソッドを通じて関数を使用する場合は、上記のように現在のオブジェクトのプロパティを使用することができます。もちろん、これを使用して直接呼び出すこともできます。 もっと複雑なことについて話すと、たとえば、ここでは $(".demo") をオブジェクトとして $.each() に渡します jQuery や html オブジェクトが渡されない場合もあります。ただし、オブジェクトまたは配列です。

配列には他にも多くのオブジェクトやメソッドがあります。

こうすることで、より多くの効果を得ることができます。

3. call または apply を使用してコールバック モードを実装します。

上記のコードからわかるように、




コードをコピーします。 🎜>

コードは次のとおりです:


callback.call(obj,args)

コードをコピー コードは次のとおりです。

callback.apply([obj],args) )

のようなコードの場合、コールバック関数を渡すだけで自分で呼び出すことができ、コードの再利用を向上させるのに非常に役立ちます。

ただし、コードの可読性の低下、結合の増加など、いくつかの欠点もあります。

時々何かを受け取った場合は、忘れないように記録してください。