是否可以在 ES6 Set 实例上使用数组迭代方法？

Question

我正在使用 ES6 Set 实例，我需要对它们应用一些转换。如果它们是数组，这些转换会很简单。这是一个例子：

let s = new Set;
s.add(1);
s.add(2);
s.add(3);
let n = s.filter(val => val > 1); // TypeError, filter not defined
let n = Array.prototype.filter.call(s, val => val > 1); // []

我希望结果是一个新的 Set 或一个数组。我同样想使用其他数组理解方法，如filter、map、reduce 等。我也希望在 ES6 Map 实例上也有类似的行为。

这可能吗，还是我需要使用 vanilla JS 数组？

Answer 1

您可以使用

获取数组中 s 的值

Array.from(s.values())

Array.from documentation 声明它从类数组或可迭代对象创建一个新的 Array 实例。

Set.values 返回一个新的 Iterator 对象，其中包含按插入顺序排列的 Set 对象中每个元素的值。

所以你的代码变成了

let s = new Set;
s.add(1);
s.add(2);
s.add(3);
let n = Array.from(s.values()).filter(val => val > 1)

Answer 2

您不能直接在Set 或Map 对象上使用Array 方法。数组方法需要 .length 和 [n] 索引，这不是 Set 或 Map 的工作方式。

您可以使用Array.from(s) 将Set 转换为数组，也可以创建自己的方法来直接对Set 或Map 进行操作。如果您要经常这样做并且所需的最终结果是Set 或Map，那么最好不要转换为数组，修改然后再转换回来。另外，将 Map 转换为数组并不是那么简单，因为您既有键又有值（可能必须是对象数组）。

例如，您可以为 Set 对象创建自己的 .filter() 方法，如下所示：

Set.prototype.filter = function(fn) {
    let result = new Set();
    for (let val of this) {
       if (fn(val, this) === true) {
           result.add(val);
       }
    }
    return result;
}

let s = new Set;
s.add(1);
s.add(2);
s.add(3);
let n = s.filter(val => val > 1); 


// log the output

// log output
document.write("Set {" + Array.from(n).join(", ") +"}");

可以为其他 Array 方法创建类似的方法。