ES6: Set数据结构

ES6 提供了新的数据结构 Set。

概念: Set类似于数组，但是成员的值都是唯一的，没有重复的值。

生成方式:

Set本身是一个构造函数，用来生成 Set 数据结构。

const s = new Set();

Set函数可以接受一个数组作为参数，用来初始化。

const set = new Set([1, 2, 3, 4, 4]);

属性:

size(): 判断Set属性中元素个数

const s = new Set([1, 2, 2, 3])
console.log(s.size);

实例方法:

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

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

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

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

const s = new Set(); 
s.add(1).add(2).add(3); // 向 set 结构中添加值 
s.delete(2) // 删除 set 结构中的2值 
s.has(1) // 表示 set 结构中是否有1这个值 返回布尔值 
s.clear() // 清除 set 结构中的所有值

遍历

我们一般用for…of即可, 因为keys(), values()结果是一样的.

keys() 返回键名的遍历器, 这里的键名, 事实上就是键值

let s1 = new Set([1, 2, 2, 3, 4])
for(let i of s1.keys()) {
  console.log(i); // 1 2 3 4
}

values() 返回键值的遍历器

let s1 = new Set([1, 2, 2, 3, 4])
for(let i of s1.values()) {
  console.log(i); // 1 2 3 4
}

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

let s1 = new Set([1, 2, 2, 3, 4])
for(let i of s1.entries()) {
  console.log(i); // 1 2 3 4
}
/*
  test.html:12 (2) [1, 1]
  test.html:12 (2) [2, 2]
  test.html:12 (2) [3, 3]
  test.html:12 (2) [4, 4]
*/

forEach() 用于对每个成员执行某种操作，没有返回值

s.forEach(value => console.log(value))

拓展方法:

1-将Set转化为数组

let s1 = new Set([1, 2, 2, 3, 4])
console.log(s1);
// 将Set转化为数组
console.log([...s1]);
console.log(Array.from(s1));

2-数组去重

let arr = [1, 2, 2, 2, 3, 4];

// Plan1:
let newArr1 = [...(new Set(arr))]

// Plan2:
let newArr2 = Array.from(new Set(arr));

console.log(newArr1); // [1, 2, 3, 4]
console.log(newArr2); // [1, 2, 3, 4]

面试题: 复杂数组的去重

let list = [1, 2, 2, "Nathan", "Nathan", [1, 2], [1, 2], {name: "Chen"}, {name: "Chen"}]
function check(arr) {
  let res = new Set()
  return arr.filter((item)=>{
    // 判断 has return false
    // 没有 return true
    let id = JSON.stringify(item)
    if(res.has(id)) {
      return false
    }else{
      res.add(id)
      return true
    }
  })
}
console.log(check(list));

参考: 013-ES6-Set数据结构_哔哩哔哩_bilibili