A, the Set

  1. Members of the value of theUnique not to repeat, the form is{}.
  2. You can take an array as an argument for initialization.
  3. Size, has(), add(), delete(), clear().
  4. Use directlyfor ofTraverse.
  5. The specific type is Set.
let set = new Set([1.1.1.2.3]);  / / {1, 2, 3}
[...set]     // [1, 2, 3], which can be used for array de-duplication
set.size     / / 3
set.add(4)   // {1, 2, 3, 4}
set.delete(1)  / / {2, 3, 4}
set.has(1)  // Returns a Boolean value true
set.clear()  // {}, clear all members
Copy the code

1. Difference between a Set and an array

  • Repeatable or not

2. Difference between WeakSet and Set

(1) WeakSet members can only be objects, but not other types of values. (2) All objects in WeakSet are weak references, that is, garbage collection mechanism does not consider WeakSet’s reference to the object. In other words, if the object is no longer referenced by other objects, the garbage collection mechanism will automatically reclaim the memory occupied by the object, regardless of the object still exists in the WeakSet.

Map :(similar, but not an object)

  1. Map keys can be of various types compared to objects, and are more suitable for Hash.
  2. Can take an array as an argument,Both sides are parentheses, separated by commas inside.
  3. Size, has(), set(,), get(), delete(), clear()
  4. Map keys are bound to memory addresses. If the memory addresses of the keys are different, they are regarded as two keys and will not be overwritten. The strict equality operator is used when the key is a primitive type, and NaN, like Set, is considered equal to itself.
  5. withfor ofTraverse.
  6. The specific type is Map.
const map = new Map([  // Double parentheses with only comma inside
  ['name'.'Jack'],
  ['title'.'Author']]); map.size/ / 2
map.has('name')  // true
map.get('name')  // 'Jack'
map.set('age'.'30');
map.set('age'.'20');  // Multiple assignments to the same key overwrite
Copy the code

1. Map and array conversion

(1) Map => array:

const map = new Map([['name'.'Jack'],
  ['title'.'Author']]); [...map]// [ [ 'name', 'Jack' ], [ 'title', 'Author' ] ]
Copy the code

Array => Map:

new Map([['name'.'Jack'],
  ['title'.'Author']]);// { 'name' => 'Jack', 'title' => 'Author' }
Copy the code

2. Difference between Map and Object

  • Type of key name: Map can be any type, Object can only be a string.
  • Iterable: Map has an Iterator interface, which can be used for traversal, but Object cannot be traversed.
  • Length: map. size can get the length directly, Object does not.
  • Orderliness: Elements filled into a Map retain their original order (in insertion order), whereas Object does not.

3. Difference between WeakMap and Map

  • WeakMap only accepts objects as key names (except null) and does not accept values of other types as key names.

  • The object to which the key name of WeakMap points is not included in the garbage collection mechanism.

  • WeakMap has no traversal operation, no size attribute and no clear method.

Note that WeakMap weakly references only the key name, not the key value. Key values are still normal references.

4. Application scenarios

Basically, if you want to add data to an object and don’t want to interfere with garbage collection, you can use WeakMap. A typical application scenario is when a WeakMap structure can be used to add data to a DOM element of a web page. When the DOM element is cleared, its corresponding WeakMap record is automatically removed.

Proxy

Proxy can be understood as a layer of “interception” before the target object. All external access to the object must pass this layer of interception. Therefore, Proxy provides a mechanism for filtering and rewriting external access.

// Assign custom interception behavior to the target object
var proxy = new Proxy(target, handler);
Copy the code

1. Methods of data hijacking

Data hijacking refers to the practice of accessing or modifying a property of an object, using a piece of code to intercept the behavior, perform additional operations or modify the return result.

  • Object.definProperty()
  • Proxy