ES6 set基本用法丨技术开发分享录

ES6 set基本用法

{{ detail.nickname }}

转载 翻译 {{ formatTime(detail.create_time) }} 字数 {{ detail.content && detail.content.length }} 阅读 {{ detail.read_num }} {{ formatTag(v) }}

"ES6 提供了新的数据结构 `Set`。它类似于数组,但是**成员的值都是唯一的**,没有重复的值。\n\n`Set`本身是一个构造函数,用来生成 Set 数据结构。\n\n```\nconst s = new Set();\n\n[2, 3, 5, 4, 5, 2, 2].forEach(x => s.add(x));\n\nfor (let i of s) {\n  console.log(i);\n}\n// 2 3 5 4\n```\n\n上面代码通过`add()`方法向 Set 结构加入成员,结果表明 Set 结构不会添加重复的值。\n\nSet函数可以接受一个数组(或者具有 iterable 接口的其他数据结构)作为参数,用来初始化。\n\n```\n// 例一\nconst set = new Set([1, 2, 3, 4, 4]);\n[...set]\n// [1, 2, 3, 4]\n\n// 例二\nconst items = new Set([1, 2, 3, 4, 5, 5, 5, 5]);\nitems.size // 5\n\n// 例三\nconst set = new Set(document.querySelectorAll('div'));\nset.size // 56\n\n// 类似于\nconst set = new Set();\ndocument.querySelectorAll('div').forEach(div => set.add(div));\nset.size // 56\n```\n\n上面代码中,例一和例二都是`Set`函数接受数组作为参数,例三是接受类似数组的对象作为参数。\n\n上面代码也展示了一种去除数组重复成员的方法。\n\n```\n// 去除数组的重复成员\n[...new Set(array)]\n```\n\n上面的方法也可以用于,去除字符串里面的重复字符。\n\n```\n[...new Set('ababbc')].join('')\n// \"abc\"\n```\n\n向 `Set` 加入值的时候,不会发生类型转换,所以`5`和`\"5\"`是两个不同的值。Set 内部判断两个值是否不同,使用的算法叫做**“Same-value-zero equality”**,它类似于精确相等运算符(===),主要的区别是向 Set 加入值时认为`NaN`等于自身,而精确相等运算符认为`NaN`不等于自身。\n\n```\nlet set = new Set();\nlet a = NaN;\nlet b = NaN;\nset.add(a);\nset.add(b);\nset // Set {NaN}\n```\n\n上面代码向 `Set` 实例添加了两次`NaN`,但是只会加入一个。这表明,在 Set 内部,两个`NaN`是相等的。\n\n另外,**两个对象总是不相等的**。\n\n```\nlet set = new Set();\n\nset.add({});\nset.size // 1\n\nset.add({});\nset.size // 2\n```\n\n上面代码表示,由于两个空对象不相等,所以它们被视为两个值。"
PS:写作不易,如要转裁,请标明转载出处。

如果此篇对您有帮助,可小额赞助,以兹鼓励!

猜你想看