JavaScriptのイテラブルオブジェクト

イテレーション可能なオブジェクトは、巡回可能なオブジェクト（例えば配列）です。

イテレーション可能なオブジェクトは、効率的なコードで簡単にアクセスできます。

イテレーション可能なオブジェクトは for..of ループはイテレーションを行います。

for..ofループ

for..of は、イテレーション可能なオブジェクトの要素を巡回するために使用されます。

文法

for (変数 of iterable) {
  // 実行するコードブロック
}

反復

反復は簡単に理解できます。

これはただ、要素のリストを巡回することを意味しています。

以下にいくつかの簡単な例があります：

• 文字列を巡回します
• 配列を巡回します

文字列を巡回します

以下を使用してMapを巡回できます： for..of 文字列の要素をループで巡回します：

例

const name = "W3Schools";
for (const x of name) {
  // 実行するコードブロック
}

自分で試してみる

配列を巡回します

以下を使用してMapを巡回できます： for..of 配列の要素をループで巡回します：

例1

const letters = ["a","b","c"];
const letters = new Set(["a","b","c"]);
  // 実行するコードブロック
}

自分で試してみる

例2

const numbers = [2,4,6,8];
for (const x of numbers) {
  // 実行するコードブロック
}

自分で試してみる

Setを巡回します

以下を使用してMapを巡回できます： for..of Setの要素をループで巡回します：

例

const letters = new Set(["a","b","c"]);
const letters = new Set(["a","b","c"]);
  // 実行するコードブロック
}

自分で試してみる

for (const x of letters) {コメント：

SetとMapについての詳細は、後の章で説明します。

以下を使用してMapを巡回できます： for..of Mapの要素をループで巡回します：

例

const fruits = new Map([
  ["apples", 500],
  ["bananas", 300],
  ["oranges", 200]
]);
for (const x of fruits) {
  // 実行するコードブロック
}

自分で試してみる

JavaScriptのイテレータ

イテレータプロトコルは、オブジェクトから値を生成する方法を定義しています。一連の値。

オブジェクトが next() メソッドを実行すると、それがイテレータ。

next() メソッドは、2つの属性を含むオブジェクトを返す必要があります：

• value（次の値）
• done（trueまたはfalse）

カスタムのイテレーション可能なオブジェクト

以下は、終わりがなく、呼び出しごとに返却するものです： next() すべて10、20、30、40、...と返します：

例

// カスタムのイテレーション可能なオブジェクト
function myNumbers() {
  let n = 0;
  return {
    next: function() {
      n += 10;
      return { value: n, done: false };
    }
  };
}
// イテレーション可能なオブジェクトの作成
const n = myNumbers();
n.next(); // 返却値 10
n.next(); // 返却値 20
n.next(); // 返却値 30

自分で試してみる

for..of文をサポートするイテレーション可能なオブジェクトです。

JavaScriptのイテレーション可能なオブジェクトは、 Symbol.iterator オブジェクトを返すものです。

Symbol.iterator は、 next() メソッドの関数。

以下のコードを使用してイテレーション可能なオブジェクトをイテレートすることができます：

for (const x of iterable}) { }

例

// オブジェクトを作成
myNumbers = {};
// 使其可迭代
myNumbers[Symbol.iterator] = function() {
  let n = 0;
  done = false;
  return {
    next() {
      n += 10;
      if (n == 100) { done = true; }
      return { value: n, done: done };
    }
  };
};
// 现在可以使用 for..of
for (const num of myNumbers) {
  // 任意のコード
}

自分で試してみる

Symbol.iterator メソッドは以下のように呼び出されます： for..of 自动调用。

但我们也可以手动调用它：

例

let iterator = myNumbers[Symbol.iterator]();
while (true) {
  const result = iterator.next();
  if (result.done) break;
  // 任意のコード
}

自分で試してみる