Detaillierte Erläuterung der Map/WeakMap-Kenntnisse in ECMAScript6_javascript

Das JS-Objekt selbst ist eine Schlüsselwertstruktur. Warum muss ES6 Map hinzufügen?

1. Karte

1. Kartenkonstruktor

Sehen wir uns zunächst die einfache Verwendung von Map an

// 字符串作为key， 和JS对象类似
var map = new Map()
// set
map.set('name', 'John')
map.set('age', 29)
// get
map.get('name') // John
map.get('age') // 29

Dieser Code scheint nicht so prägnant zu sein wie JS-Objekte

Aber die Stärke von Map liegt darin, dass sein Schlüssel jeder Art sein kann

// 对象作为key演示
var xy = {x: 10, y: 20}  // 坐标
var wh = {w: 100, h: 200} // 宽高
var map = new Map()
// set
map.set(xy, '坐标')
map.set(wh, '宽高')
// get
map.get(xy) // '坐标'
map.get(wh) // '宽高'

Das Obige zeigt eine Karte, die Objekte als Schlüssel verwendet. Das Folgende ist eine Illustration

Der Map-Konstruktor unterstützt auch die Übergabe von Arrays

var map = new Map([["name", "John"], ["age", "29"]])
 
// 遍历key
for (var key of map.keys()) {
  console.log(key) // name, age
}

2. Iteration

Verwenden Sie „for of“, um Map wie Set zu iterieren, rufen Sie „map.keys()“ für Schlüssel, „map.values()“ für Werte und „map.entries()“ für Schlüsselwert-Entitäten auf

var map = new Map()
// set
map.set('name', 'John')
map.set('age', 29)
// get
map.get('name') // 'John'
map.get('age') // 29
 
// 遍历key
for (var key of map.keys()) {
  console.log(key)
}
 
// 遍历value
for (var val of map.values()) {
  console.log(val)
}
 
// 遍历实体
for (var arr of map.entries()) {
  console.log('key: ' + arr[0] + ', value: ' + arr[1])
}
 
// 遍历实体的简写
for (var [key, val] of map.entries()) {
  console.log('key: ' + key + ', value: ' + val)
}
 

3. Methoden und Eigenschaften

2. WeakMap

Unterschiede zur Karte

Akzeptiert keine Basistypwerte als Schlüsselnamen
Keine Schlüssel, Werte, Einträge und Größe
Es gibt folgende Methoden

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, er gefällt Ihnen allen.