Home > Web Front-end > JS Tutorial > body text

What is the Set data structure of ES6

一个新手
Release: 2017-09-09 13:57:55
Original
1725 people have browsed it

ES6: Set

Understand Set

ES6 provides the data structure Set. Similar to an array, but without duplicate values.

  • Set itself is a constructor used to generate the Set data structure

const s = new Set();
[2, 3, 5, 4, 5, 2, 2].forEach(x => s.add(x));for(let i of s ) {    console.log(i); //2 3 4 5 }
Copy after login
  • Set can accept an array ( Or array-like object) as a parameter, used to initialize

var set = new Set([1, 2, 3, 4, 4]);
[...set]; // [1, 2, 3, 4]
Copy after login

can be used for array deduplication[...new Set(array)]

Array.from()The method can convert the Set structure into an arrayArray.from(new Set(array))

  • When adding a value to a Set, no type conversion will occur (similar to exact equality ===), but please note that in the Set NaN is equal to itself. The other two objects are always not equal.

let set = new Set();let a = NaN;let b = NaN;
set.add(a);
set.add(b);
set; //{NaN} 只能加入一个,说明Set内部两个NaN是相等的
Copy after login

Set instance properties and methods

  • Properties:

    • Set.prototype.constructor: Constructor, the default is Set function

    • Set.prototype.size: Returns the total number of members of the instance

  • Operation method (for the specific implementation of the method, see: My simple study of JS collections):

    • add(value ): Add a value and return the Set structure itself

    • delete(value): Delete a value and return a Boolean value

    • has(value): Returns a Boolean value indicating whether it is a member

    • clear(): Clear all members , no return value

s.add(1).add(2).add(2); //链式写法s.size(); //2s.has(3); //falses.delete(2);
s.has(2); //false
Copy after login
  • 遍历方法

    • keys():返回键名的遍历器(什么是遍历器?Iterator)

    • values():返回键值的遍历器

    • entries():返回键值对的遍历器

    • forEach():使用回调函数遍历每个成员

这里要注意Set的键名和键值是同一个值,所以key()和values()行为是一致的。

let set = new Set(['red', 'green', 'no']);for(let item of set.keys()) {    console.log(item); //red green no}for(let item of set.values()) {    console.log(item); //red green no}for(let item of set.entries()) {    console.log(item); //['red': 'red'] ['green': 'green'] ['no': 'no']}//对每个成员执行某种操作,参数依次为键值、键名、集合本身new Set([1, 2, 3]).forEach((value, key) => console.log(value * 2)); //2 4 6
Copy after login

操作集合

let a = new Set([1, 2, 3]);let b = new Set([4, 3, 2]);//并集let union = new Set([...a, ...b]); //{1, 2, 3, 4}//交集let intersect = new Set([...a].filter(x => b.has(x))); //{2, 3}//差集let difference = new Set([...a].filter(x => !b.has(x))); //{1}
Copy after login

号外:扩展运算符(...)内部使用for...of循环,所以应该知道for of是干嘛的吧

数组的map()filter()可用于Set

let set = new Set([1, 2, 3]);set = new Set([...set].map(x => x * 2)); //set: {2, 4, 6}let set = new Set([1, 2, 3, 4, 5]);set = new Set([...set].filter(x => (x % 2) == 0)); //set {2, 4}
Copy after login

The above is the detailed content of What is the Set data structure of ES6. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template