在ES6生成器中使用ES5數組方法

Question

在ES6生成器中使用新ES5陣列功能的正確方法是什么？ 我是否必須先將iterable顯式轉換為數組，還是有更好的方法？ 例如：

function* range(low, high) {
    var i = low;
    while(i < high)
        yield i++;
}

// Sum of numbers in range, doesn't work
console.log(range(0, 10).reduce((x,y) => x + y));

Answer 1

生成器函數返回Iterator對象。 Iterator API不包括高階數組方法，如map ， reduce等，因此您需要構建一個中間數組（或使用類似wu.js的庫）。

您可以使用spread運算符從（有限）迭代器中簡明地構建一個數組：

var sum = [...range(0, 10)].reduce((e, i) => e + i)

Answer 2

使用Array.from構建數組：

console.log(Array.from(range(0, 10)).reduce((x,y) => x + y));

Array.from從iterable創建一個數組。 請參閱https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from 。

如果你想在不創建數組的情況下進行reduce，那么你最終需要做類似的事情：

var sum = 0;
for (e of range(0, 10)) sum += e;

Answer 3

由於Array.from目前在Chrome上不起作用，我需要另一種方法將Iterator轉換為數組。

（當然你可以用polyfill填充它 ）

function iterator2Array(iterator) {
    var result = [];
    for (var item in iterator) {
        result.push(item)
    }
    return result;
}

出於類似的原因，我在Map的原型中添加了一個“toArray”，這樣我基本上就可以將迭代器轉換為一個Array，這樣就可以使用它的面向功能的方法了。 當然，數組的每個項目都是[key，value]元組（與Map.entries()完全相同）

if (!Map.prototype.toArray) {
    /**
     * Transforms a map into an Array of 'tuples' [[key, value], ...]
     */
    Map.prototype.toArray = function () {
        var result = [];

        for (var item of this) {
            result.push(item);
        }

        return result;
    }
}

var m = new Map([[0, 0], ['a', 'A']]);
m.toArray()

然后你可以將它用作數組 - 記住[key，value]方法！

m.toArray().map(
    function(item, index, array) {
        var key = item[0],
        value = item[1];
        console.log(key + ": " + value);
        return value;
});

這將返回地圖的值（當然不是超級有用！）

如果您更喜歡更環保的循環：

var i = iterator.entries(),
    result = [],
    value;
while (value = i.next().value) {
    result.push(value);
}