在迭代器上使用 map()

Question

假设我们有一个 Map：let m = new Map();，使用 m.values() 返回一个映射迭代器。

但是我不能在那个迭代器上使用forEach() 或map() 并且在那个迭代器上实现一个while 循环似乎是一种反模式，因为ES6 提供了像map() 这样的函数。

那么有没有办法在迭代器上使用map()？

Answer 1

最简单和性能最低的方法是：

Array.from(m).map(([key,value]) => /* whatever */)

更好

Array.from(m, ([key, value]) => /* whatever */))

Array.from 接受任何可迭代或类似数组的东西并将其转换为数组！正如 Daniel 在 cmets 中指出的那样，我们可以在转换中添加一个映射函数来移除一个迭代，然后移除一个中间数组。

正如@hraban 在 cmets 中指出的那样，使用 Array.from 会将您的表现从 O(1) 转移到 O(n)。由于m 是Map，而且它们不可能是无限的，所以我们不必担心无限序列。在大多数情况下，这就足够了。

还有其他几种方法可以遍历地图。

使用forEach

m.forEach((value,key) => /* stuff */ )

使用for..of

var myMap = new Map();
myMap.set(0, 'zero');
myMap.set(1, 'one');
for (var [key, value] of myMap) {
  console.log(key + ' = ' + value);
}
// 0 = zero
// 1 = one

Answer 2

你可以定义另一个迭代器函数来循环这个：

function* generator() {
    for (let i = 0; i < 10; i++) {
        console.log(i);
        yield i;
    }
}

function* mapIterator(iterator, mapping) {
    for (let i of iterator) {
        yield mapping(i);
    }
}

let values = generator();
let mapped = mapIterator(values, (i) => {
    let result = i*2;
    console.log(`x2 = ${result}`);
    return result;
});

console.log('The values will be generated right now.');
console.log(Array.from(mapped).join(','));

现在您可能会问：为什么不直接使用 Array.from 呢？因为这将贯穿整个迭代器，将其保存到（临时）数组中，再次对其进行迭代，然后然后进行映射。如果列表很大（甚至可能无限），这将导致不必要的内存使用。

当然，如果项目列表很小，使用Array.from 应该绰绰有余。

Answer 3

您可以使用 itiriri 为可迭代对象实现类似数组的方法：

import { query } from 'itiriri';

let m = new Map();
// set map ...

query(m).filter([k, v] => k < 10).forEach([k, v] => console.log(v));
let arr = query(m.values()).map(v => v * 10).toArray();

Answer 4

您可以在可迭代对象上检索一个迭代器，然后返回另一个迭代器，该迭代器在每个迭代元素上调用映射回调函数。

const map = (iterable, callback) => {
  return {
    [Symbol.iterator]() {
      const iterator = iterable[Symbol.iterator]();
      return {
        next() {
          const r = iterator.next();
          if (r.done)
            return r;
          else {
            return {
              value: callback(r.value),
              done: false,
            };
          }
        }
      }
    }
  }
};

// Arrays are iterable
console.log(...map([0, 1, 2, 3, 4], (num) => 2 * num)); // 0 2 4 6 8

Answer 5

这种最简单且最高效的方法是使用Array.from 的第二个参数来实现：

const map = new Map()
map.set('a', 1)
map.set('b', 2)

Array.from(map, ([key, value]) => `${key}:${value}`)
// ['a:1', 'b:2']

这种方法适用于任何非无限可迭代。并且它避免了对 Array.from(map).map(...) 的单独调用，这将迭代可迭代两次并且性能更差。

Answer 6

看看https://www.npmjs.com/package/fluent-iterable

适用于所有可迭代对象（映射、生成器函数、数组）和异步可迭代对象。

const map = new Map();
...
console.log(fluent(map).filter(..).map(..));

Answer 7

这里的其他答案是……很奇怪。他们似乎正在重新实现部分迭代协议。你可以这样做：

function* mapIter(iterable, callback) {
  for (let x of iterable) {
    yield callback(x);
  }
}

如果你想要一个具体的结果，只需使用扩展运算符...。

[...mapIter([1, 2, 3], x => x**2)]

Answer 8

有一个提案，为Iterator 带来了多个辅助函数：https://github.com/tc39/proposal-iterator-helpers (rendered)

您现在可以通过core-js-pure 使用它：

import { from as iterFrom } from "core-js-pure/features/iterator";

// or if it's working for you (it should work according to the docs,
// but hasn't for me for some reason):
// import iterFrom from "core-js-pure/features/iterator/from";

let m = new Map();

m.set("13", 37);
m.set("42", 42);

const arr = iterFrom(m.values())
  .map((val) => val * 2)
  .toArray();

// prints "[74, 84]"
console.log(arr);