目录

1. 概述

2. 创建set

3. 操作set

1. 增删清除

 2. 迭代器

  3. 大小和名称

4. 使用场景


 

1. 概述

set 是一个构造函数, 通过new关键字来创建实例, 用来保存唯一的值

2. 创建set

new 他就完事了, 但是请注意传入的参数必须是可迭代的对象或者迭代器, 如果传入的迭代对象中包含重复的值, 那么set将会自动去除重复项

    const arr = ['a', 'b', 'c', 'a']
    const set1 = new Set(arr.values());
    const set2 = new Set(arr.keys());
    const set3 = new Set(arr.entries());
    const set4 = new Set([1, 2, 3, 1]);
    console.log(set1);
    console.log(set2);
    console.log(set3);
    console.log(set4);

为了验证set接收的参数是可迭代对象, 因此自定义了一个可迭代对象

    const obj = {
      [Symbol.iterator]() {
        let i = 0;
        return {
          next() {
            if (i < 10) {
              i++
              return { done: false, value: i }
            } else {
              return { done: true, value: undefined }
            }
          }
        }
      }
    }
    const set5 = new Set(obj);
    console.log(set5);

 结果表示确实可以, 也不多bb了,接下来看看set的原型操作一下他

3. 操作set

通过打印我们可以看到set的原型上有增,删,清除,大小,还有一些获取迭代器的方法, 接下来玩一玩

1. 增删清除

(1) add 向set数据中增加一条, 且一次只能增加一条

(2) clear 清除 set数据

(3) delete 删除set数据, 且一次只能删除一条

    const arr = [1, 2, 3, 4, 5]
    const set = new Set(arr)
    // 1. add 一次只能加一个
    set.add(6, 7)
    console.log('add', set);
    // 2. clear 清除set数据
    set.clear();
    console.log('clear', set);
    // 3. delete 删除某一项 一次只能删一个
    let i = 0;
    while (i < 10) {
      set.add(i)
      i++
    }
    set.delete(5)
    console.log(set);
    // 4. has 查看自身是否有某个值
    console.log('有1吗', set.has(1));

 2. 迭代器

entries 返回set结构键/值迭代器

keys和values 返回 set结构值的迭代器

这里有点奇怪, 不知为什么 keys 和 values 调用的是同一个函数, 可能是设计的问题吧

    const arr = ['a', 'b', 'c', 'd', 'e']
    const set = new Set(arr)
    // 4. entries 获取set结构键/值的迭代器
    const entry = set.entries()
    console.log(entry);
    // keys === values
    // 5. keys 获取set结构值的迭代器 
    const keys = set.keys()
    console.log(set.keys());
    // 6. values 获取set结构值的迭代器 
    const values = set.values()
    console.log(values);

    const setEntry = Array.from(entry) // 如果想保存操作一下转数组就行了
    console.log(setEntry);
    const setkeys = Array.from(keys) // 如果想保存操作一下转数组就行了
    console.log(setkeys);
    const setvalues = Array.from(values) // 如果想保存操作一下转数组就行了
    console.log(setvalues);

  3. 大小和名称

size 属性返回set的存储数量, Symbol.toStringTag 返回toString set时 第二个构造函数的名称

    const arr = ['a', 'b', 'c', 'd', 'e']
    const set = new Set(arr)
    console.log(set.size);
    console.log(set.toString());

4. 使用场景

最常使用的场景可能就是数组去重了吧, 反正我不经常用

Logo

Agent 垂直技术社区,欢迎活跃、内容共建。

更多推荐