“This is the sixth day of my participation in the Gwen Challenge in November. Check out the details: The Last Gwen Challenge in 2021.”

Hope is a good thing, maybe the best of things. And no good thing ever dies.

preface

Set is a new data type introduced in ES6. It is similar to an array, but the values of its members are unique and there are no duplicate values.

The basic use of Set

The Set itself is a constructor that directly generates the Set data structure.

The Set function can take an array (or some other data structure with an Iterable interface) as an argument for initialization.

Here’s an example:

const set = new Set([1, 2, 3, 4, 4]);

// Set(4) {1, 2, 3, 4}

[...set]
// [1, 2, 3, 4]
Copy the code

Set is often used to remove duplicate elements

Removes duplicate members of an array

[...new Set(array)]
Copy the code

Removes duplicate characters from a string

[...new Set('ababbc')].join('')

// "abc"
Copy the code

Properties and methods of a Set instance

Setattribute

  • Set.prototype.constructorThe: constructor is the defaultSetFunction.
  • Set.prototype.sizeReturns theSetThe total number of members of an instance.
const set = new Set([1, 2, 3, 4]);
set.size // 4
Copy the code

SetThe method of

Operation method (for manipulating data)

  • Set.prototype.add(value): Adds a value, returnsSetThe structure itself.
  • Set.prototype.delete(value): Deletes a value and returns a Boolean value indicating whether the deletion was successful.
  • Set.prototype.has(value): Returns a Boolean value indicating whether the value isSetA member of.
  • Set.prototype.clear(): Clears all members with no return value.
s.add(1).add(2).add(2); // notice that 2 is added twice s.size // 2 s.haas (1) // true s.haas (2) // true s.haas (3) // false s.delte (2); s.has(2) // falseCopy the code

The array. from method converts a Set structure to an Array.

const items = new Set([1, 2, 3, 4, 5]);
const array = Array.from(items);
Copy the code

Can be used as a method to remove duplicate elements from an array

function dedupe(array) {
  return Array.from(new Set(array));
}

dedupe([1, 1, 2, 3]) // [1, 2, 3]
Copy the code

Traversal method (for traversing members)

Set has four traversal methods

  • Set.prototype.keys(): returns a traverser for key names
  • Set.prototype.values(): returns a traverser for key values
  • Set.prototype.entries(): returns a traverser for key-value pairs
  • Set.prototype.forEach(): Iterates through each member using the callback function

The Set structure has no key name, only key value (or the key name and key value are the same value), so keys and values behave exactly the same

The iterator returned by the Entries method contains both the key name and the key value, so it prints an array of exactly equal members one at a time

let set = new Set(['red', 'green', 'blue']);

for (let item of set.keys()) {
  console.log(item);
}
// red
// green
// blue

for (let item of set.values()) {
  console.log(item);
}
// red
// green
// blue

for (let item of set.entries()) {
  console.log(item);
}
// ["red", "red"]
// ["green", "green"]
// ["blue", "blue"]
Copy the code

You can use for… The of loop iterates through Set, omitting the values method

let set = new Set(['red', 'green', 'blue']);

for (let x of set) {
  console.log(x);
}
// red
// green
// blue
Copy the code

An instance of a Set structure, like an array, has a forEach method that performs some operation on each member and returns no value

let set = new Set([1, 4, 9]);
set.forEach((value, key) => console.log(key + ' : ' + value))
// 1 : 1
// 4 : 4
// 9 : 9
Copy the code

Application of traversal

Extended operators (…) Internally use for… The of loop can be used with the Set structure.

let set = new Set(['red', 'green', 'blue']);
let arr = [...set];
// ['red', 'green', 'blue']
Copy the code

The extension operator, combined with the Set structure, allows array de-duplication.

let arr = [3, 5, 2, 2, 5, 5]; let unique = [...new Set(arr)]; / / [3, 5, 2]Copy the code

Sets make it easy to implement Union (Union), intersection (Intersect), and Difference

let a = new Set([1, 2, 3]); let b = new Set([4, 3, 2]); // let union = new Set([...a,...b]); / / the Set {1, 2, 3, 4} / / intersection let intersects = new Set ([...] a filter (x = > b.h as (x))); // set {2, 3} let difference = new set ([...a].filter(x =>! b.has(x))); // Set {1}Copy the code

How do I change the Set structure synchronously during traversal?

Let Set = new Set([1, 2, 3]); let Set = new Set([1, 2, 3]) set = new Set([...set].map(val => val * 2)); Array.from 'let set = new set ([1, 2, 3]); set = new Set(Array.from(set, val => val * 2)); // Set values are 2, 4, 6Copy the code

conclusion

If this article helped you, please like 👍 and follow ⭐️.

If there are any errors in this article, please correct them in the comments section 🙏🙏

Welcome to pay attention to my wechat public number, exchange technology together, wechat search 🔍 : “fifty years later”