ES6之Set对象详解
Set是什么
- 是ES6提供的一种新的数据结构，类似于数组，但是成员的值都是唯一的，没有重复的值。
- Set 本身是一个构造函数，用来生成 Set 数据结构。
- Set 对象允许你存储任何类型的唯一值，无论是原始值或者是对象引用。
- Set 中的元素只会出现一次，即 Set 中的元素是唯一的。
- 另外，NaN 和 undefined 都可以被存储在 Set 中，NaN 之间被视为相同的值（尽管 NaN !== NaN）。
- Set 函数可以接受一个数组（或者具有 iterable 接口的其他数据结构）作为参数，用来初始化。
const set1 = new Set();
var object1 = new Object();
set1.add(42);
set1.add('forty two');
set1.add('forty two'); // 不存储相同的值，会被忽略
set1.add(object1);
console.log(set1); // Set(3) {42, "forty two", {…}}
console.log(set1.size); // 3向 Set 加入值时认为NaN等于自身，而精确相等运算符认为NaN不等于自身。
let set = new Set();
let a = NaN;
let b = NaN;
set.add(a);
set.add(b);
set // Set {NaN}add() 方法用来向一个 Set 对象的末尾添加一个指定的值。注意：不能添加重复的值
var mySet = new Set();
mySet.add(1);
mySet.add(5).add("some text"); // 可以链式调用
console.log(mySet);
// Set [1, 5, "some text"]
mySet.add(5).add(1); // 重复的值不会被添加进去
console.log(mySet); // {1, 5, "some text"}clear() 方法用来清空一个 Set 对象中的所有元素。返回值：undefined
mySet.clear();delete() 方法可以从一个 Set 对象中删除指定的元素。成功删除返回 true，否则返回 false。
var mySet = new Set();
mySet.add("foo");
mySet.delete("bar"); // 返回 false，不包含 "bar" 这个元素
mySet.delete("foo"); // 返回 true，删除成功
mySet.has("foo"); // 返回 false，"foo" 已经成功删除forEach（callback, thisArg） 方法会根据集合中元素的插入顺序，依次执行提供的回调函数。
callback:回调函数有三个参数:
- 元素的值
- 元素的索引
- 正在遍历的集合对象
thisArg:回调函数执行过程中的 this 值。可选
function logSetElements(value1, value2, set) {
console.log("s[" + value1 + "] = " + value2, set);
}
new Set(["foo", "bar", undefined]).forEach(logSetElements);
// logs:
// "s[foo] = foo" Set(3) {"foo", "bar", undefined}
// "s[bar] = bar" Set(3) {"foo", "bar", undefined}
// "s[undefined] = undefined" Set(3) {"foo", "bar", undefined}但是由于集合对象中没有索引(keys)，所以前两个参数都是Set中元素的值(values)，之所以这样设计回调函数是为了和Map 以及Array的 forEach 函数用法保持一致。如果提供了一个 thisArg 参数给 forEach 函数，则参数将会作为回调函数中的 this值。否则 this 值为 undefined。
has() 方法返回一个布尔值来指示对应的值value是否存在Set对象中。
var mySet = new Set();
mySet.add('foo');
mySet.has('foo'); // 返回 true
mySet.has('bar'); // 返回 false
var set1 = new Set();
var obj1 = {'key1': 1};
set1.add(obj1);
set1.has(obj1); // 返回 true
set1.has({'key1': 1}); // 会返回 false，因为其是另一个对象的引用
set1.add({'key1': 1}); // 现在 set1 中有2条（不同引用的）对象了entries() 方法返回一个新的迭代器对象 ，这个对象的元素是类似 [value, value] 形式的数组，value 是集合对象中的每个元素，迭代器对象元素的顺序即集合对象中元素插入的顺序。由于集合对象不像 Map 对象那样拥有 key，然而，为了与 Map 对象的 API 形式保持一致，故使得每一个 entry 的 key 和 value 都拥有相同的值，因而最终返回一个 [value, value] 形式的数组。 返回值：一个新的包含 [value, value] 形式的数组迭代器对象，value 是给定集合中的每个元素，迭代器 对象元素的顺序即集合对象中元素插入的顺序。
var mySet = new Set();
mySet.add("foobar");
mySet.add(1);
mySet.add("baz");
var setIter = mySet.entries(); // SetIterator {"foobar" => "foobar", 1 => 1, "baz" => "baz"}
console.log(setIter.next().value); // ["foobar", "foobar"]
console.log(setIter.next().value); // [1, 1]
console.log(setIter.next().value); // ["baz", "baz"]values() 方法返回一个 Iterator 对象，该对象按照原Set 对象元素的插入顺序返回其所有元素。
keys() 方法是这个方法的别名 (与 Map 对象相似); 它的行为与 value 方法完全一致，返回 Set 对象的元素。
返回值：将返回一个新生成的可迭代对象，以插入 Set 对象的顺序返回其包含的每个元素的值。
var mySet = new Set();
mySet.add("foo");
mySet.add("bar");
mySet.add("baz");
var setIter = mySet.values();
console.log(setIter.next().value); // "foo"
console.log(setIter.next().value); // "bar"
console.log(setIter.next().value); // "baz"应用实例:
数组去重
[...new Set([1, 3, 3, 34, 555, 2, 2])] // [1, 3, 34, 555, 2]
function dedupe(array) {
return Array.from(new Set(array));
}
dedupe([1, 1, 2, 3]) // [1, 2, 3]
arrRemove([1, 3, 3, 34, 555, 2, 2]) // [1, 3, 34, 555, 2]
function arrRemove (arr) {
let tempArr = arr
arr = []
let set = new Set(tempArr)
for (let i of set) {
arr.push(i)
}
return arr
}去除字符串里面的重复字符。
[...new Set('ababbc')].join('')
// "abc"set对象与数组之间的转换
var arr = [1,2,3,4,4];
var set = new Set(arr) //数组转换set对象
set //{1,2,3,4}
//方法一
Array.from(set) //[1,2,3,4]
//方法二
[...set] //[1,2,3,4]数组去重&并集
let arr1 = [1,2,3,4,5];
let arr2 = [4,5,6,7,8];
let a = new Set(arr1);
let b= new Set(arr2)
new Set([...arr1,...arr2]) //{1,2,3,4,5,6,7,8}
let arr3 = [...new Set([...arr1,...arr2])] //[1,2,3,4,5,6,7,8]交集
let arr3 = new Set(arr1.filter(x=>b.has(x))) //{4,5}差集
let arr3 = new Set(arr1.filter(x=>!b.has(x))) //{1,2,3}
let arr4 = new Set(arr2.filter(x=>!a.has(x))) //{6,7,8}
[...arr3,...arr4] //[1,2,3,6,7,8]腾讯云开发者
