Array.prototype[Symbol.iterator]()

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since May 2018.

[Symbol.iterator]() は Array インスタンスのメソッドで、反復可能プロトコルを実装しており、スプレッド構文や for...of ループのような反復可能オブジェクトを期待するほとんどの構文で配列を利用することができます。配列の各インデックスの値を返す配列イテレーターオブジェクトを返します。

このプロパティの初期値は Array.prototype.values プロパティの初期値と同じ関数オブジェクトです。

試してみましょう

構文

js
array[Symbol.iterator]()

引数

なし。

返値

Array.prototype.values() の返値と同じです。これは配列内のすべてのインデックスの値を生成する新しい反復可能イテレーターオブジェクトです。

例

for...of ループを用いた反復処理

このメソッドを直接呼び出す必要はほとんどないことに注意してください。 [Symbol.iterator]() メソッドが存在することで、配列を[反復処理可能](/ja/docs/Web/JavaScript/Reference/Iteration_protocols#the_iterable_protocol)にすることができ、 for...of` ループのような反復処理構文では、自動的にこのメソッドを呼び出して、ループするイテレーターを取得します。

HTML

html
<ul id="letterResult"></ul>

JavaScript

js
const arr = ["a", "b", "c"];
const letterResult = document.getElementById("letterResult");
for (const letter of arr) {
  const li = document.createElement("li");
  li.textContent = letter;
  letterResult.appendChild(li);
}

結果

イテレーターを手動で手繰る

返されたイテレーターオブジェクトの next() メソッドを手動で呼び出すことで、反復処理を最大限に制御することもできます。

js
const arr = ["a", "b", "c", "d", "e"];
const arrIter = arr[Symbol.iterator]();
console.log(arrIter.next().value); // a
console.log(arrIter.next().value); // b
console.log(arrIter.next().value); // c
console.log(arrIter.next().value); // d
console.log(arrIter.next().value); // e

文字列と文字列配列を同じ関数で処理

文字列と配列はどちらもイテレータープロトコルを実装しているので、汎用関数は両方の入力を同じ方法で処理するように設計することができます。これは、 Array.prototype.values() を直接呼び出すよりも優れており、入力が配列であるか、少なくともそのようなメソッドを持つオブジェクトであることを要求されます。

js
function logIterable(it) {
  if (typeof it[Symbol.iterator] !== "function") {
    console.log(it, "is not iterable.");
    return;
  }
  for (const letter of it) {
    console.log(letter);
  }
}

// Array
logIterable(["a", "b", "c"]);
// a
// b
// c

// String
logIterable("abc");
// a
// b
// c

// Number
logIterable(123);
// 123 is not iterable.

仕様書

Specification
ECMAScript Language Specification
# sec-array.prototype-%symbol.iterator%

ブラウザーの互換性

BCD tables only load in the browser

関連情報