ES6 新增 Set 数据解构

Set

1.什么是Set

ES6 提供的新的数据结构 Set,他类似数组,但是其成员的值都是唯一的,其结构内没有重复的值。

2.创建 Set 数据结构

通过构造函数 Set 创建,可生成一个 Set 数据结构,类型是object。

  let s = new Set();
  console.log(typeof s) //object

Set 函数可以接受一个数组(或具有iterable 接口的其他数据类型)作为参数,用来初始化

  let s = new Set([1,2,3,4,5])

注意:Set 结构中没有键名,可以认为键名和键值为同一个值。
注意:Set 结构中,认为 NaN 等于自身,即任意的 NaN 是相等的

3.Set 数据结构的属性

(1) Set.prototype.size 返回 Set 结构中成员的个数
(2) Set.prototype.constructor 构造函数。默认就是 Set 函数

4.Set 数据结构的方法

(1) Set.prototype.add(value)
向 Set 数据结构中添加一个成员。
返回值:Set数据结构本身。(可以使用链式操作)

   s.add(1).add("a").add([1,2]).add({m:1,n:2});

(2) Set.prototype.delete(value)
删除 Set 数据结构中指定的成员value。
返回值:布尔值。存在value删除成功返回true,否则false。

  s.delete("a");

(3) Set.prototype.clear()
清空 Set 数据结构。
返回值:undefined。

   s.clear();

(4) Set.prototype.has(value)
判断 Set 数据结构中是否存在指定成员value。
返回值:布尔值。存在返回true,否则返回false。

   s.has("a");

(5) Set.prototype.keys() 返回键名的遍历器

  let set = new Set(['a', 'b', 'c']);
  for (let item of set.keys()) {
    console.log(item);
  }
  // a
  // b
  // c

(6) Set.prototype.values() 返回键值的遍历器

  for (let item of set.values()) {
    console.log(item);
  }
  // a
  // b
  // c

(7) Set.prototype.entries() 返回键值对的遍历器

  for (let item of set.entries()) {
    console.log([key,value]); 
  }
  // ["a", "a"]
  // ["b", "b"]
  // ["c", "c"]

(8) Set.prototype.forEach() 使用回调函数遍历每个成员

  //Set 结构的实例与数组一样,也拥有forEach方法,用于对每个成员执行某种操作,没有返回值。
  let set = new Set([1, 4, 9]);
  set.forEach((value, key) => console.log(key + ' : ' + value))
  // 1 : 1
  // 4 : 4
  // 9 : 9

5.数组与 Set 数据结构相互转化

5.1 数组转为 Set 数据结构

a.新建 Set 数据结构,遍历数组,将数组中的每个元素放到 Set 数据结构中。

  let s = new Set();
  let arr = [1,2,3,4,5];
  arr.forEach( item => s.add( item ) );

b.将数组作为参数传入 Set 的构造函数中。

  let s = new Set(arr);

5.2 Set 数据结构转为数组

a.遍历 Set 数据结构,将每个成员放到数组中。

  s.forEach( item => array.push( item ));

b.通过Array.from(),将可遍历的 Set 数据结构转化为数组。

  Array.from(s);

c.扩展运算符...

  [...s];

  //运用 Set 数据成员是唯一的,可轻松对数组进行去重
  [...new Set(array)]
posted @ 2022-04-16 19:55  糊涂啊  阅读(69)  评论(0编辑  收藏  举报