JavaScript で for…of 構文を使用してループ カウンター/インデックスを取得する 質問する

JavaScript で for…of 構文を使用してループ カウンター/インデックスを取得する 質問する

for...ofJavaScript の基本的な構文は次のようになると理解しています。

for (let obj of myArray) {
  // ...
}

しかし、この構文で反復処理するときにループ カウンター/インデックスを取得するにはどうすればよいでしょうか?

(同じ質問がfor...inオブジェクトのプロパティ名を反復処理する表記にも当てはまります)

次のような明示的なループ カウンターを使用できることはわかっています。

for (let i = 0; i < myArray.length; i++) {
  const obj = myArray[i];
  console.log(i);
}

または、ループ外でインデックスを手動で追跡します。

let i = 0;
for (let obj of myArray) {
  console.log(i);
  i++;
}

しかし、私はよりシンプルなループを使うほうが好きです。for...of見た目も良く、より意味があると思います。

これを可能にする言語の例として、Python では次のように簡単です。

for i, obj in enumerate(my_array):
    print(i)

ベストアンサー1

for…in値ではなくプロパティ名を反復処理し、不特定の順序で(はい、ES6 以降でも同様です)。配列を反復処理するためにこれを使用しないでください。配列を反復処理する場合は、forEach値とインデックスの両方を関数に渡す ES5 のメソッドがあります。

var myArray = [123, 15, 187, 32];

myArray.forEach(function (value, i) {
    console.log('%d: %s', i, value);
});

// Outputs:
// 0: 123
// 1: 15
// 2: 187
// 3: 32

あるいはES6のArray.prototype.entriesは、現在のブラウザ バージョン全体でサポートされるようになりました。

for (const [i, value] of myArray.entries()) {
    console.log('%d: %s', i, value);
}

for…ofただし、一般的な反復可能オブジェクト (ではなくループを使用する場合for…in) には、組み込みのものはありません。

function* enumerate(iterable) {
    let i = 0;

    for (const x of iterable) {
        yield [i, x];
        i++;
    }
}

for (const [i, obj] of enumerate(myArray)) {
    console.log(i, obj);
}

実際にプロパティを列挙することを意味している場合for…in、追加のカウンターが必要になります。動作する可能性がありますが、含まれるのは独自のプロパティObject.keys(obj).forEachのみであり、プロトタイプ チェーン上の任意の場所にある列挙可能なプロパティが含まれます。for…in

おすすめ記事