简单实用ES6之Set

163 阅读2分钟

ES6提供了新的数据结构Set,类似数组,本身是一个构造函数,值唯一。—— 《ECMAScript 6 入门教程》

1、基础用法 - Set 对象方法

方法

描述

add

添加某个值,返回Set对象本身。

clear

删除所有的键/值对,没有返回值。

delete

删除某个键,返回true。如果删除失败,返回false。

forEach

对每个元素执行指定操作。

has

返回一个布尔值,表示某个键是否在当前 Set 对象之中。

ps: 还有个size(),类似array.length().

let set = new Set([1, 2, 3])

// add()

set.add(4); // 不会添加重复值 结果:{1, 2, 3, 4}.

set.add(NaN); // 执行两遍 结果: {1, 2, 3, NaN}, 这里我们需要注意,NaN === NaN 它是false, *但 是在Set内部两个NaN是相等的.

set.add({}); // 执行两遍 结果: {1, 2, 3, {...}, {...}}, 两个对象是不相等的, 即 {} === {} 执行false,所以Set会插入两个{}.

// clear() 就是清空内部所有键值对,就不多说了。

// delete() 删除某个值,返回布尔值

set.delete(2); // 返回true, 在执行 false, 因为2已经删除了

// has() // 返回布尔值,判断值是否是Set的成员

set.has(1) // 返回true

接下来就是我认为最有用的一些方法,我们在某些特定的逻辑中可以使用到的一些方法,

比如:

1. 数组去重:

let arr = [1, 2, 3, 3, 2, 1]; Array.from(new Set(arr)); // [1, 2, 3]

还可以字符串去重:

let str = 'aabbcc';

Array.from(new Set(str)).join('');

// 换个写法

[...new Set(str)].join('');

2. 并集(适用场景:我们需要两个数组合并,去掉重复项的一个新数组)

let a = [1, 2, 3, 3, 2, 1];  let b = [4, 3, 2, 1];

Array.from(new Set([...a, ...b])); // [1, 2, 3, 4]

3. 交集(适用场景:两个数组 包含哪些相同项)

let a = [1, 2, 3, 3, 2, 1]; let b = [4, 3, 2, 1];

Array.from(new Set([...a].filter(x => new Set(b).has(x)))); // 偷懒写一块了

拆开无非就是,

a = new Set(a); b = new Set(b);

[...a].filter(x => b.has(x)); // [1, 2, 3]

[...b].filter(x => a.has(x)); // [3, 2, 1] 结果是一样的 就是顺序变了而已

4. 差集(适用场景:求不同项)

let a = [1, 2, 3, 3, 2, 1]; let b = [4, 3, 2, 1];

[...a].filter(x => !b.has(x));  // []

[...b].filter(x => !a.has(x)); // [4]

上文内容中涉及到扩展运算符..., 作用和Array.from类似, 可以将某些数据结构转换为数组,就不做多介绍了。