Preface
In JavaScript,Set
is a built-in data structure for storageUnique valuecollection.Set
Objects allow you to store values of any type, whether it is a primitive type or object type. The following isSet
Common methods and operations:
1. Create a Set:
You can passnew Set()
To create a new oneSet
Object.
const mySet = new Set();
2. Add elements to Set:
use.add()
Methods can be used toSet
Add elements to .
(1); // Set { 1 } (5); // Set { 1, 5 } (1); // Set { 1, 5 } (1 already exists and will not be added repeatedly)('hello'); // Set { 1, 5, 'hello' }
3. Check whether there is a certain value in Set:
use.has()
Method to check if a value is inSet
middle.
((1)); // true ((10)); // false
4. Delete the elements in Set:
use.delete()
Methods can delete an element.
(5); // true (mySet); // Set { 1, 'hello' }
5. Get the size of Set:
use.size
Attributes can be obtainedSet
The number of elements.
(); // 2
6. Clear Set:
use.clear()
Methods can be clearedSet
All elements in .
(); (); // 0
7. Traversal Set:
You can useforEach()
orfor...of
Loop to traverseSet
。
PS: [1, 2, 3, 'a', 'b'] is an array.
const anotherSet = new Set([1, 2, 3, 'a', 'b']); // Use forEach to traverse(value => { (value); }); // Use for...of to traversefor (let value of anotherSet) { (value); }
8. Conversion of Set and array:
You can easily putSet
Convert to an array, or convert the array toSet
。
// Set to arrayconst setArray = [...anotherSet]; // [1, 2, 3, 'a', 'b'] // Convert the array to Setconst array = [1, 2, 2, 3, 4]; const arraySet = new Set(array); // Set { 1, 2, 3, 4 }
9. Deduplicate values in the array:
UtilizeSet
The uniqueness of you can quickly remove duplicates in an array.
const numbers = [1, 2, 3, 3, 4, 5, 5]; const uniqueNumbers = [...new Set(numbers)]; // [1, 2, 3, 4, 5] First convert the data to set, and then convert the set to an array.
The difference between set and map:
1. Storage type:
-
Set: Store onlyUnique value, does not store key-value pairs. Each element is a value and cannot be repeated.
const mySet = new Set(); (1); (2); (2); // Cannot add duplicate values(mySet); // Set { 1, 2 }
-
Map: What is storedKey-value pairs. Each element has a key and a corresponding value, and the key can be of any type (including objects).
const myMap = new Map(); ('key1', 'value1'); ('key2', 'value2'); (myMap); // Map { 'key1' => 'value1', 'key2' => 'value2' }
2. Uniqueness of elements:
-
Set: Duplicate values cannot be stored. Set ensures that each element in the collection is unique.
const set = new Set([1, 1, 2, 3]); (set); // Set { 1, 2, 3 } (1 Will not repeat)
-
Map: The key must be unique, but different keys can correspond to the same value. Repeated values are allowed in the Map, as long as the keys are different.
const map = new Map(); ('a', 1); ('b', 1); // Same value, different keys(map); // Map { 'a' => 1, 'b' => 1 }
3. Use of keys and values:
-
Set: Only values, no keys. Each value is in
Set
All are the only elements.const set = new Set([1, 2, 3]); (value => (value)); // The value is traversed
-
Map: Each element has keys and values, use
.set(key, value)
To add key-value pairs, use.get(key)
to get the corresponding value.const map = new Map(); ('name', 'Alice'); ('age', 30); (('name')); // 'Alice'
4. Iteration:
-
Set:Travel
Set
When you can only traverse the values.const set = new Set([1, 2, 3]); for (let value of set) { (value); // 1, 2, 3 }
-
Map:Travel
Map
You can traverse keys, values or key-value pairs.const map = new Map([['key1', 'value1'], ['key2', 'value2']]); // traversal keyfor (let key of ()) { (key); // key1, key2 } // traversal valuefor (let value of ()) { (value); // value1, value2 } // traverse key-value pairsfor (let [key, value] of ()) { (key, value); // key1 value1, key2 value2 }
5. Method:
-
Set:
-
.add(value)
:TowardsSet
Add value to . -
.delete(value)
:deleteSet
value in . -
.has(value)
:examineSet
Is there a certain value in ? -
.clear()
: ClearSet
。 -
.size
: ObtainSet
Size.
-
-
Map:
-
.set(key, value)
:TowardsMap
Add key-value pairs to . -
.get(key)
: Get the corresponding value through keys. -
.delete(key)
: Delete a key-value pair. -
.has(key)
:examineMap
Is there a key in it? -
.clear()
: ClearMap
。 -
.size
: ObtainMap
Size.
-
6. Usage scenarios:
-
Set: Suitable for processingUnique value setScenarios such as array deduplication and storing a set of values without duplication.
const uniqueValues = new Set([1, 2, 2, 3, 4]); // Set { 1, 2, 3, 4 }
-
Map: Suitable for needsKey-value pairsStored scenarios, such as cache, dictionary, associative array, etc.
const dictionary = new Map(); ('apple', 'A fruit'); ('car', 'A vehicle');
Summarize:
- SetUsed to store a unique set of values, no keys.
- MapUsed to store key-value pairs, the key and value can be of any type.
This is the introduction to this article about the common methods and operations of set in JavaScript. For more related content on set usage in JS, please search for my previous articles or continue browsing the related articles below. I hope everyone will support me in the future!