likes
comments
collection
share

Set 对象基础知识

作者站长头像
站长
· 阅读数 15

引言

Map 对象的出现可以看作是对 Object 对象的一种扩展和延伸,让 JS 语言对键值对格式的数据处理方式“换了天地”。

Array 对象作为 Object 的万年兄弟,又怎会错过这“旷世奇遇”,于是,Set 对象也应运而生,对 Array 进行了扩展和延伸。

关于 Set 对象

Set 对象是值的集合,可以按照插入的顺序迭代它的元素。

Set 中的值可以是任意类型的值,包括数字、字符串、布尔值、对象等。

Set 中的元素只会出现一次,即 Set 中的元素是唯一的。

关键词:值的集合值唯一顺序任意类型

Set 对象的操作方法基本和 Map 对象的类似,只是细节处略有不同而已。

add(value)

向 Set 中添加一个值,如果值已经存在,则不会进行任何操作。

const set = new Set();
set.add("a"); // Set(1) {'a'}
set.add("b"); // Set(2) {'a', 'b'}
set.add("a"); // Set(2) {'a', 'b'}

注意:Set 对象中重复添加值,是不会进行任何操作(比如:覆盖)的,这点和 Map 不同。

has(value)

用于判断 Set 中是否包含指定的值,如果包含则返回 true,否则返回 false。

const set = new Set();
set.has("a"); // false
set.add("a");
set.has("a"); // true

delete(value)

用于删除 Set 中指定的值,如果值存在则删除该值并返回 true,否则返回 false 并不会进行任何操作。

const set = new Set();
set.delete("a"); // false
set.add("a");
set.delete("a"); // true

clear()

用于清空 Set 中的所有值,使其成为一个空的 Set。

const set = new Set();
set.add('a'); // Set(1) {'a'}
set.add('b'); // Set(2) {'a', 'b'}
set.clear()
console.log(set); // Set(0) {size: 0}

size

返回 Set 中的值的数量。

const set = new Set();
console.log(set.size); // 0
set.add("a");
console.log(set.size); // 1
set.add("b");
console.log(set.size); // 2

forEach(callbackFn, thisArg)

对 Set 中的每个值执行指定的回调函数,回调函数接受三个参数:当前值、当前值的键和 Set 对象本身。

const set = new Set(["a", "b"]);
set.forEach((...args) => {
    console.log(args);
});

// 输出:
// (3) ['a', 'a', Set(2)]
// (3) ['b', 'b', Set(2)]

keys() 、values() 和 entries()

返回一个迭代器,用于遍历 Set 中的所有键和值。因为 Set 是值的集合,所以键和值是相同的。

const set = new Set(["a", "b"]);
console.log(set.keys()); // SetIterator {'a', 'b'}
console.log(set.values()); // SetIterator {'a', 'b'}
console.log(set.entries()); // SetIterator {'a' => 'a', 'b' => 'b'}

Set 和 Array

前面也说了,Set 算是对 Array 的扩展延伸,因此它们之间也是“纠缠不清”。

使用 Array 对 Set 赋初值

在创建 Set 对象时,可以传入一个数组,这个数组中的元素就会成为 Set 的初值。

const set = new Set(["a", "b"]);
console.log(set); // Set(2) {'a', 'b'}

因为 Set 中的值都是唯一的,如果在 Set 初始化时传入有重复值的数组,重复值会被自动过滤。

const set = new Set(["a", "b", "a", "b", "c"]);
console.log(set); // Set(3) {'a', 'b', 'c'}

将 Set 转为 Array

可以通过 Array.from() 方法将 Set 对象转为 Array。

const set = new Set(["a", "b", "c"]);
const arr = Array.from(set);
// const arr = [...set];
console.log(arr); // (3) ['a', 'b', 'c']

利用 Set 对数组去重

结合上面两点,我们可以实现对数组的去重。

let arr = ["a", "b", "c", "a", "b"];
const set = new Set(arr);
arr = Array.from(set);
console.log(arr); // (3) ['a', 'b', 'c']

// 简化写法如下:
arr = [...new Set(arr)];

结束语

关于 Set 对象的基础知识就介绍这么多,希望能够对你有所帮助!

~

~ 全文完

~

转载自:https://juejin.cn/post/7271459513093898299
评论
请登录