1. ホーム
  2. javascript

[解決済み] JavaScriptのfor...of構文でループのカウンタ/インデックスを取得する

2022-03-21 03:05:23

質問

<ブロッククオート

注意

の質問は、まだ適用されます。 for…of ループを使用しないでください。 for…in を反復処理するために 配列 を使うか、それを使って の上に プロパティ のオブジェクトを作成します。 とはいえ、この


が基本だと理解しています。 for…in JavaScriptの構文は次のようになります。

for (var obj in myArray) {
    // ...
}

しかし、どのようにループを得るか カウンタ/インデックス ?

みたいなことができるんだろうとは思うのですが

var i = 0;
for (var obj in myArray) {
    alert(i)
    i++
}

あるいは、古き良きものでも。

for (var i = 0; i < myArray.length; i++) {
    var obj = myArray[i]
    alert(i)
}

しかし、私はむしろ、よりシンプルな for-in ループを使用します。見た目もいいし、意味もあると思うんです。

もっとシンプルでエレガントな方法はないのでしょうか?


Pythonでは簡単です。

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

解決方法は?

for…in は値ではなくプロパティ名に対して繰り返し処理を行います。 不特定の順序で (そう、ES6以降も)。配列の反復処理に使うべきではありません。配列については、ES5 の forEach メソッドに渡す関数に値とインデックスの両方を渡します。

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 は、プロトタイプチェーンのどこにでも列挙可能なプロパティを含みます。