Question

我正在试图弄清楚如何将一个迭代器添加到javascript类，以便该类可以用于for ... in循环。遵循Mozilla的指示不会产生他们声称的结果。 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Iterators_and_Generators 给出示例的Jsfiddle：http://jsfiddle.net/KQayW/

function Range(low, high){
  this.low = low;
  this.high = high;
  this.current = low;
  this.next = function() {
    if (this.current > this.range.high)
      throw StopIteration;
    else
      return this.current++;
  }
}
function RangeIterator(range){
  this.range = range;
  this.current = this.range.low;
}
RangeIterator.prototype.next = function(){
  if (this.current > this.range.high)
    throw StopIteration;
  else
    return this.current++;
};
Range.prototype.__iterator__ = function(){
  return new RangeIterator(this);
};
var range = new Range(3, 5);
for (var i in range)
  document.getElementById("test").innerHTML = i+"</br>"; // prints 3, then 4, then 5 in sequence

它不会打印出范围内的数字，而是打印出“__iterator __”！

有谁知道如何让它发挥作用？

Answer 1

使用ES2015很简单：

function Range(start, end) {
    var ret = {};
    ret[Symbol.iterator] = function *() {
        while (start < end) 
            yield start++;
    }
    return ret;
}

虽然你必须使用：

for (var x of Range(1, 10))

Answer 2

Mozilla文档声明Iterators功能是在JavaScript 1.7中引入的。尽管Chrome支持1.7中的某些功能，但它并不完全受支持，因此无效。如果你在最新的Firefox版本中测试你的代码，你会看到它的工作原理。

虽然你可能想要附加范围值而不是替换整个div。

http://jsfiddle.net/KQayW/2/

function Range(low, high){
  this.low = low;
  this.high = high;
  this.current = low;
  this.next = function() {
  if (this.current > this.range.high)
    throw StopIteration;
  else
    return this.current++;
  }
}
function RangeIterator(range){
  this.range = range;
  this.current = this.range.low;
}
RangeIterator.prototype.next = function(){
  if (this.current > this.range.high)
    throw StopIteration;
  else
    return this.current++;
};
Range.prototype.__iterator__ = function(){
  return new RangeIterator(this);
};
var range = new Range(3, 5);
for (var i in range)
  document.getElementById("test").innerHTML += i+"</br>"; // prints 3, then 4, then 5 in sequence

Answer 3

使用ES2015可以更简单

＆＃13;

productFlavors

＆＃13;

Answer 4

或者您也可以不使用生成器语法。如果您想了解迭代器的工作方式，这可能会有所帮助。

function range(start, end) {
    return {
        [Symbol.iterator]() {
            return this;
        },
        next() {
            return start <= end ? {value: start++} : {done: true};
        }
    };
}

console.log(...range(1, 10));

range()函数返回一个“可迭代对象”。可迭代对象是可迭代的，因为它具有返回“迭代器对象”的函数[Symbol.iterator]()。迭代器对象是一个迭代器，因为它具有next()函数。

在这种情况下，Iterable和Iterator是同一个对象，从而简化了它。

将自定义迭代器添加到javascript类

4 个答案: