javascriptのいくつかのよくある遍歴データ構造の文法

3280 ワード

巡回する javascript

JavaScriptに接触してここ数年、初めて文法を総括します.以前は大体の時間は古いバージョンのJavaScriptにコードを書いていましたので、大体の時間はfor…inを使っています.ES 6の発表に従って、いろいろな文法を整理して、長所と短所を指摘する必要があります.
for/while循環文
これは多くなくて、すべての言語のいずれも関わる循環.ただ単にfor/whileの能力は限られています.性能的にも心配です.また、特定の構造によってデータ構造を遍歴することができます.ここでは詳しくないです.簡単に例を挙げます.

var arr = [1,2,3];
for(var i = 0,len = arr.length;i < len;i ++) {
  var value = arr[i];
}

for…in文
これもJavaScriptの比較的早い特有の語句です.その役割はオブジェクトのキー名を遍歴することです.
使い方

var obj = {
  a : '1',
  b : '2',
  c : '3'
};
for(var key in obj) {
  var value = obj[key];
}

長所
配列や関数など、すべてのオブジェクトタイプのデータをサポートします.文法は簡単で、他の言語ではあまり見られません.
欠点
通常のキーだけではなく、プロトタイプのチェーンのキーまですべて巡回しました.
アドバイス
常用する対象を遍歴した時に使用します.ここの常用対象は上で挙げたキーのペアです.
forEachメソッド
phpにはforeachの文法がありますが、JavaScriptにはありません.そしてphpのforeachは対象を遍歴しても大丈夫です.ただし、JavaScriptでは、forEachは配列のみで提供される内蔵方法です.
使い方

[1,2,3].forEach(function(value,index){
  console.log(index + ':' + value);
});

ちょっと
indexとvalueを同時に取得することができます.以前のように配列を巡回する必要はなく、forの｛｝で値を取得する必要があります.
欠点
配列のみをサポートします.また、いったん呼び出したら、完全に一回を巡回します.break、continue、returnは無効です.
アドバイス
配列を巡回する時だけ使用します.
for...ofステートメント
これはES 6によって追加された構文です.ES 6に基づいて新たに追加されたIteratorとSymbolが開発したものです.つまりES 5コードでしかアナログできませんが、原理的には実現できません.
使い方

var list = new Map().set('a',1).set('b',2).set('c',3);
for (var [key,value] of list) {
  console.log(key + ' => ' + value);
}

長所
巡回中に直接値を取ります.感じとfor…inは相補的な形をしています.遍歴の中でキーパッドの名前を取って、もう一つは価値を取ります.もう一つの利点は、Iteratorインターフェースを配置した任意のデータ構造、さらにはJavaScriptではないデータタイプ、すなわち自分で定義したデータ構造を遍歴することができることである.
欠点
Map構造以外はキー名を取ることができません.普通のオブジェクトを巡回するためには使用できません.
アドバイス
何回も継続して値が欲しい時には使えますが、普通の対象には使えません.Mapタイプはオススメです.
再帰的(最後の呼び出し)
ES 6において、関数の最後の呼び出しを最適化しましたが、最後の呼び出し構造が再帰関数である場合、性能をより節約して、ほぼ昇天します.
使い方

function forEach(object,factory,_keyIndex = 0,_keys = object.keys()) {
 var key = _keys[_keyIndex];
 var value = object[key];
 if(typeof factory === 'function') factory(key,value);
 _keyIndex ++;
 return forEach(object,factory,_keyIndex,_keys);
}
var obj = {
  a : 1,
  b : 2,
  c : 3
};
forEach(obj,function(key,value){
  console.log(key + ' => ' + value);
});

長所
サイクルに関係しないことができ、再帰的な性能はサイクルより高く、特に後調再帰的である.
欠点
コードの構造は複雑で、千変万化して、統一していない規則は掌握することができます.
アドバイス
複雑なデータを処理すると、サイクルで性能が消耗し、性能が気になる時に使うかもしれません.
map、filterの方法
map法は配列を遍歴することもできますが、その主な用途は遍歴中に修正されます.一方、filterはプロセスを経るのと同じですが、この値は現在遍歴されているかどうかを調べるためだけの戻り値です.つまり、この2つの方法は、遍歴された配列自体を修正することができる.
第三者each、map方法:理想的な方法
jQueryとundersscoreを含めてeachを提供しました.これは私たちの理想的な使い方です.上のforEach、for…ofを組み合わせたものです.私たちが最も望んでいる方法です.
使い方

$.each(object,(key,value) => {
  console.log(key + ' => ' + value);
});
[1,2,3].each((index,value) => {
  console.log(index + ':' + value);
});

長所
私たちが一番よく使うarrayとobjectの二つのタイプを遍歴してもいいです.キーと値ももらえます.
欠点
性能は不確定です.言葉の原生ではないですから、内部は加工されています.また、Mapなどの構造をサポートしているかどうかは分かりません.
アドバイス
複雑度が高い場合は、コードが簡潔で明確であると同時に、これらの第三者ライブラリの場合にも基づいて使用されたい.実は性能的にもあまり心配しなくてもいいです.今のパソコンはすごいです.
この記事は最初に私のブログに掲載されました.http://www.tangshuang.net/286...私とマイクロ信号で交流できます.

Javascript乱弾設計モードシリーズ(0)－対象基礎及びインターフェースと継承類の実現