[transfer] sorting out the usage methods of Map and Set objects in ES6

Keywords: Attribute network

1. Map object

The Map object is a simple key / value mapping. Any value, both object and original, can be used as a key or a value.

Use the set method to treat object o as a key of m. Treat object o as a key of m

var m = new Map();
var o = {p: "Hello World"};
m.set(o, "content")
m.get(o) // "content"

Map can also accept an array as a parameter. The members of the array are arrays representing key value pairs.

var map = new Map([["name", "Zhang San"], ["title", "Author"]]);
map.size // 2
map.get("name") // "Zhang three"
map.get("title") // "Author"

You need to pay attention to the following points when using Map objects:
(1) the key of Map is actually bound to the memory address. As long as the memory address is different, it is regarded as two keys.
(2) if you use an object as a key name, you don't need to worry about the same name of your own attribute as the original author's attribute.
(3) if the key of Map is a simple type of value (number, string, Boolean value), as long as the two values are strictly equal, Map treats it as a key,
Includes 0 and - 0.
(4) in addition, although NaN is not strictly equal to itself, Map treats it as the same key.

Properties and methods of Map object:

var map = new Map();
map.size                    // Returns the number of key / value pairs in the map object
map.set(key, value)         // Set the value of the key key to value. If the key already exists, update the value and return the map object
map.get(key)                // Get the value with key as key
map.has(key)                // Determine whether the map object has a key key, and return the bool value
map.delete(key)             // Delete a key and return the bool value
map.clear()                 // Clear all key value pairs, no return value

Traversal method of Map object:

for (var key of myMap.keys()) {         // Traverse all keys
  console.log(key);
}

for (var value of myMap.values()) {      // Traverse all values
  console.log(value);
}

for (var item of myMap.entries()) {     // Returns the traverser of all members, then traverses all key value pairs
  console.log(item[0] + " = " + item[1]);
}

myMap.forEach(function(value, key) {        // Traversal method of map
  console.log(key + " = " + value);
}, myMap)

 
2. Set object

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

Set itself is a constructor, which is used to generate set data structure. An instance must be generated through new, otherwise an error will be reported
Set object's properties and methods:

let set = new Set([1,2,3,1,2,3,45,1,6,5,3])
set.constructor                     // Returns the constructor, which is Set by default.
set.size                            // Returns the total number of members of the set.
set.add(value)                      // Add a value to return the set object.
set.delete(value)                   // Delete a value and return a Boolean value to indicate whether the deletion is successful.
set.has(value)                      // Returns a Boolean value indicating whether the value is a member of the Set.
set.clear()                         // Clear all members, no return value.

Traversal method of Set object:

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"]

let set = new Set([1, 2, 3]);
set.forEach((value, key) => console.log(value * 2) )
// 2  4  6

Use the Set object to clear the same value in the array:

let arr = [1,2,3,4,5,6,6,7,8,6,4,4,5,2,3,5,6,8]
arr = [...new Set(arr)]             // [1, 2, 3, 4, 5, 6, 7, 8]

 
3. The weakMap object and the weakSet object
Reference resources Wisdom network
 

Reprinted from Wisdom network

Posted by thankqwerty on Fri, 03 Jan 2020 16:21:50 -0800