es6之Set数据结构（二）今天开始学习Set数据结构的属性和方法。 1.属性：常用到的就一个：Set.prototyp

今天开始学习Set数据结构的属性和方法。

1.属性：常用到的就一个：Set.prototype.size：返回Set实例的成员总数。

let s = new Set();s.add(NaN);console.log(s.size) // 1

2.方法：Set 实例的方法分为两大类：操作方法（用于操作数据）和遍历方法（用于遍历成员）。下面先介绍四个操作方法。

2.1：操作方法

add(value)：添加某个值，返回 Set 结构本身。

delete(value)：删除某个值，返回一个布尔值，表示删除是否成功。

has(value)：返回一个布尔值，表示该值是否为Set的成员。

clear()：清除所有成员，没有返回值。

let s = new Set();s.add(1).add(2).add(2); // 可以链式调用说明add方法返回的是Set结构本身
console.log(s.size) // 2 说明成员不重复
console.log(s.has(1)) // true
console.log(s.has(2)) // true
console.log(s.has(3)) // false
console.log(s.delete(2)); // true 表示删除成功
console.log(s.has(2))  // false
console.log(s.clear()) // undefined
console.log(s.size) // 0 说明上一步操作已把全部成员清空

2.2：遍历方法

keys()：返回键名的遍历器

values()：返回键值的遍历器

entries()：返回键值对的遍历器

forEach()：使用回调函数遍历每个成员

特殊说明：遍历顺序为插入顺序。

先看前三个方法：

let set = new Set(['red', 'green', 'blue']);
for (let item of set.keys()) {  console.log(item);}
// red
// green
// blue
for (let item of set.values()) {  console.log(item);}
// red
// green
// blue
/* 观察：由于 Set 结构没有键名，只有键值（或者说键名和键值是同一个值），所以keys方法和values方法的行为完全一致 */
for (let item of set.entries()) {  console.log(item);}
// ["red", "red"]
// ["green", "green"]
// ["blue", "blue"]
// entries方法返回的遍历器，同时包括键名和键值，所以每次输出一个数组，它的两个成员完全相等

思考：因为keys()和values()方法在此行为一致，所以用一个即可，常用values()方法。而entries()方法在实际场景中并不常用，所以也用的少。那么难道每次遍历Set结构都要调用values()方法吗？

答案：Set 结构的实例默认可遍历，它的默认遍历器生成函数就是它的values方法。也就意味着，可以省略values方法，直接用for...of循环遍历 Set

let set = new Set(['red', 'green', 'blue']);
for (let x of set) {  console.log(x);}
// red
// green
// blue

最后来看forEach()遍历，一句话总结：和数组的forEach()方法99%相似。唯一的不同之处在于：Set 结构的键名就是键值（两者是同一个值）。而数组不是。看下面的例子：

let set = new Set([1, 4, 9]);
set.forEach((value, key) => console.log(key + ' : ' + value))
// 1 : 1
// 4 : 4
// 9 : 9
let arr = [1,4,9];
arr.forEach((value, key) => console.log(key + ' : ' + value))
// 0 : 1
// 1 : 4
// 2 : 9

3.延伸拓展

前提知识：

扩展运算符（...）内部使用for...of循环

Set结构的实例可以省略values方法，直接用for...of循环遍历 Set

由此得出如下代码：

let set = new Set(['red', 'green', 'blue']);
let arr = [...set];// ['red', 'green', 'blue']

这是Set结构和数组互相转化的第一种方式。

同时，数组本身也提供了一个方法：Array.from()

let set = new Set(['red', 'green', 'blue']);
let arr = Array.from(set);
// ['red', 'green', 'blue']

总结：这两种方式的互相转化，为Set结构和数组结构架起了桥梁，对数据的操作可以使用这两种结构的优势方法。比如数组去重，就可以利用Set结构的成员不重复这一优势，将复杂问题简单化。

更多内容请关注公众号：前端共读。