javascript - 如何在 JavaScript 中使自定义迭代器接口(interface)可迭代

Question

我有一个数组，并且我已经覆盖了它的默认迭代器行为。问题是，重写后，返回的迭代器变得不可迭代，并且 for..of..loop 失败，但对数组有效，但对数组的迭代器 next() 方法的显式调用仍然有效。下面是代码:

let arr = ["A", "B", "C", "D", "E", "F"];
arr[Symbol.iterator] = function(){
  let i = 0;

  return {
    //Iterator interface
    next:function(){
      //IteratorResult Interface
      return {
        value: arr[i++]+"..",
        done: arr[i] == undefined?true:false
      }
    }
  }
}

这是迭代器对象

let arrIterator = arr[Symbol.iterator](); //An iterator object returned but not iterable

在迭代器对象上使用 for..of..loop 进行消费试验

for (let i of arrIterator){
  console.log(i);
}

输出

在数组上使用 for..of..loop 进行消费试验

for (let i of arr){
  console.log(i);
}

输出

使用显式 next() 方法调用进行消费试验

console.log(arrIterator.next());
console.log(arrIterator.next());
console.log(arrIterator.next());
console.log(arrIterator.next());
console.log(arrIterator.next());
console.log(arrIterator.next());
console.log(arrIterator.next());
console.log(arrIterator.next());

输出

我真的很想知道如何使自定义迭代器可迭代以供 for..of..loop 使用。

谢谢

Answer 1

您还需要实现 Iterable 协议(protocol)(而不仅仅是 Iterator)

添加[Symbol.iterator]: function() { return this; } 到你的 Iterator 对象中，它就会工作。

let arr = ["A", "B", "C", "D", "E", "F"];
arr[Symbol.iterator] = function() {
  let i = 0;

  return {
    //Iterator interface
    next: function() {
      //IteratorResult Interface
      return {
        value: arr[i++] + "..",
        done: arr[i] == undefined ? true : false
      }
    },
    // Iterable interface
    [Symbol.iterator]: function() {
      return this;
    }
  }
}

let arrIterator = arr[Symbol.iterator](); //An iterator object returned but not iterable

for (let i of arrIterator) {
  console.log(i);
}

参见Iteration protocols了解更多信息