ホームページ > ウェブフロントエンド > jsチュートリアル > Prototype ソース コードの Enumerable part_prototype の各メソッドの簡単な分析

Prototype ソース コードの Enumerable part_prototype の各メソッドの簡単な分析

WBOY
リリース: 2016-05-16 17:57:05
オリジナル
949 人が閲覧しました

JavaScript では、この部分は Prototype の作者が Ruby から借用したものであるため、Enumerable の痕跡はまったくありません。また、Enumerable は実際には他のオブジェクトに直接適用される可能性はありません。他のオブジェクトの「親クラス」であると言えます (ただし、Object の extend メソッドを呼び出し、そのメソッドの直接コピーを作成するだけです)。 )。

Ruby については詳しくありませんが、Enumerable のいくつかのメソッドを見ると、Python のメソッドに似ています。

Enumerable の最も重要なメソッドの 1 つは、シーケンスのすべての要素を走査し、対応する処理を実行することです。各メソッドについてよく理解しておく必要があります。ただし、それらのほとんどは配列に適用されます。たとえば、ネイティブ配列の forEach メソッドと jQuery のチェーン呼び出しはすべて each メソッドに依存します。 jQuery セレクターは DOM オブジェクトの配列を返し、返された配列でそれぞれを呼び出して各要素を個別に処理するためです。

通常、それぞれには 2 つのパラメータがあります。1 つは反復処理関数およびメソッドに対応するコンテキストです。

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

var each = Array.prototype.forEach | | function( iterator,context){
for(var i = 0,len = this.length ; i iterator.call(context,this[i],this); 🎜>}
};

上記のメソッドに続いて、現在の要素をすべて出力する print メソッドを使用して Array オブジェクトを拡張します。

コードをコピー コードは次のとおりです。
Array.prototype.each = Array.prototype .forEach | function(iterator,context){
for(var i = 0,len = this.length ; i iterator.call(context,this[i],i ,this) ;
}
};
Array.prototype.print = function(){
this.each(function(item){
console.log(item);
}) ;
}
console.log([1,2,3,4].print());//1,2,3,4

列挙可能, 前述したように、Enumerable は特定のメソッドに対応しているわけではなく、「親クラス」として他のオブジェクトに適用されているため、その each メソッドは「サブクラス」の _each メソッドを呼び出します。任意の混合列挙可能モジュールのオブジェクトは、実際のループに作用する反復コードとして _each メソッドを提供する必要があります。

次に、Array.prototype に _each メソッドと each メソッドを実装します。実装 1:

コードをコピーコードは次のとおりです:
Array.prototype.each = function(iterator,context){
this._each(iterator,context)
}
Array.prototype._each = function (iterator,context){
for(var i = 0,len = this.length ; i < len ; i ){
iterator.call(context,this[i],i,this) ;
}
};

前に述べたように、_each はイテレータ パラメータを提供するだけで済みますが、_each は Array.prototype にも拡張されているため、実装時にコンテキストパラメータ。したがって、Enumerable では、_each の 2 番目のコンテキスト パラメーターは使用されず、実装されているかどうかはそれぞれに影響しません。したがって、上記の実装は _each のコンテキストに依存すべきではないため、それぞれを次のように変更します。

コードをコピー コードは次のとおりです。
Array.prototype.each = function(iterator,context){
varindex = 0;
this._each(function(value){
iterator.call) (context,value,index );
})
}

これにより、各メソッドの独立性が向上し、このEnumerableは後続のHashでも使用できるようになります。 _each メソッドが提供されている限り、トラバースされたオブジェクトはどれも Enumerable から対応するメソッドを取得できます。

したがって、上記の出力例を Enumerable の形式で実装すると、次の結果が得られます:

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

var Enumerable = {};
Enumerable.each = function(iterator, context) {
var Index = 0;
this._each(function(value){
iterator) .call(context, value, index );
return this;
Enumerable = function(){
this.each(item){
console.log(item);
})
};
Array.prototype._each = function(iterator,context){
for(var i = 0,len = this. length ; i < len ; i ){
iterator.call(context,this[i],i,this);
}; 以下の実装ソースコードが使用されますextend メソッド
for(var key in Enumerable){
Array.prototype[key] =
}; ;//1,2,3,4


それぞれの実装を理解することが、Enumerable オブジェクトを理解するための鍵であり、後続の Array と Hash の両方が Enumerable オブジェクトに組み込まれます。これは非常に重要です。 。
再版が Xiaoxi Shanzi [http://www.cnblogs.com/xesam/] からのものであることを明記してください。
関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート