Detaillierte Interpretation der Kartendatenstruktur in Javascript

In diesem Artikel wird hauptsächlich die Kartendatenstruktur von es6-Javascript vorgestellt. Der Herausgeber findet sie recht gut. Jetzt werde ich sie mit Ihnen teilen und als Referenz verwenden. Folgen wir dem Editor, um einen Blick darauf zu werfen

Dieser Artikel stellt die Kartendatenstruktur von es6-Javascript vor und teilt sie mit allen. Die Details sind wie folgt:

Der Zweck und die grundlegende Verwendung der Map-Struktur

JavaScript-Objekt (Object) ist im Wesentlichen eine Sammlung von Schlüssel-Wert-Paaren (Hash-Struktur), aber traditionell können nur Zeichenfolgen als Schlüssel verwendet werden. Dies bringt große Einschränkungen für den Einsatz mit sich.

var data = {}; 
var element = document.getElementById('myp'); 
data[element] = 'metadata'; 
data['[object HTMLpElement]'] // "metadata"

Die ursprüngliche Absicht des obigen Codes besteht darin, einen DOM-Knoten als Schlüssel der Objektdaten zu verwenden, aber da das Objekt nur Zeichenfolgen als Schlüsselnamen akzeptiert, wird das Element automatisch in eine Zeichenfolge konvertiert [object HTMLpElement] .

Um dieses Problem zu lösen, stellt ES6 die Kartendatenstruktur bereit. Es ähnelt einem Objekt und ist ebenfalls eine Sammlung von Schlüssel-Wert-Paaren, der Umfang von „Schlüssel“ ist jedoch nicht auf Zeichenfolgen beschränkt. Als Schlüssel können verschiedene Arten von Werten (einschließlich Objekten) verwendet werden. Mit anderen Worten: Die Objektstruktur stellt die „String-Wert“-Korrespondenz bereit, und die Map-Struktur stellt die „Wert-Wert“-Korrespondenz bereit, was eine vollständigere Implementierung der Hash-Struktur darstellt. Wenn Sie eine „Schlüssel-Wert“-Datenstruktur benötigen, ist Map besser geeignet als Object.

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

Der obige Code verwendet die set-Methode, um das Objekt o als Schlüssel von m zu behandeln, verwendet dann die get-Methode, um den Schlüssel zu lesen, und verwendet dann die delete-Methode, um den Schlüssel zu löschen.
Als Konstruktor kann Map auch ein Array als Parameter akzeptieren. Die Mitglieder dieses Arrays sind Arrays, die Schlüssel-Wert-Paare darstellen.

var map = new Map([ 
 ['name', ' 张三 '], 
 ['title', 'Author'] 
]); 
map.size // 2 
map.has('name') // true 
map.get('name') // " 张三 " 
map.has('title') // true 
map.get('title') // "Author"

Wenn der obige Code eine neue Map-Instanz erstellt, gibt er zwei Schlüssel an: Name und Titel.

Der Map-Konstruktor akzeptiert ein Array als Parameter und führt tatsächlich den folgenden Algorithmus aus.

var items = [ 
 ['name', ' 张三 '], 
 ['title', 'Author'] 
]; 
var map = new Map(); 
items.forEach(([key, value]) => map.set(key, value));

Im folgenden Beispiel sind die Zeichenfolge true und der boolesche Wert true zwei verschiedene Schlüssel.

var m = new Map([ 
 [true, 'foo'], 
 ['true', 'bar'] 
]); 
m.get(true) // 'foo' 
m.get('true') // 'bar'

Wenn demselben Schlüssel mehrere Werte zugewiesen werden, überschreiben die nachfolgenden Werte die vorherigen Werte.

let map = new Map(); 
map 
 .set(1, 'aaa') 
 .set(1, 'bbb'); 
map.get(1) // "bbb"

Der obige Code weist Schlüssel 1 zwei aufeinanderfolgende Werte zu, und der letztere Wert überschreibt den vorherigen Wert.

Wenn ein unbekannter Schlüssel gelesen wird, wird undefiniert zurückgegeben.

new Map().get('asfddfsasadf') 
 // undefined

Beachten Sie, dass nur Verweise auf dasselbe Objekt von der Map-Struktur als gleicher Schlüssel betrachtet werden. Seien Sie dabei sehr vorsichtig.

var map = new Map(); 
map.set(['a'], 555); 
map.get(['a']) // undefined

Die Set- und Get-Methoden im obigen Code scheinen für denselben Schlüssel zu gelten, aber tatsächlich handelt es sich um zwei Werte und die Speicheradressen sind unterschiedlich. Daher kann die Get-Methode den Schlüssel und nicht lesen gibt undefiniert zurück.

In ähnlicher Weise werden zwei Instanzen desselben Werts als zwei Schlüssel in der Map-Struktur betrachtet.

var map = new Map(); 
var k1 = ['a']; 
var k2 = ['a']; 
map 
 .set(k1, 111) 
 .set(k2, 222); 
map.get(k1) // 111 
map.get(k2) // 222

Im obigen Code sind die Werte der Variablen k1 und k2 gleich, sie werden jedoch als zwei Schlüssel in der Map-Struktur betrachtet.

Wie aus dem Obigen ersichtlich ist, sind die Schlüssel von Map tatsächlich an die Speicheradressen gebunden. Solange die Speicheradressen unterschiedlich sind, werden sie als zwei Schlüssel betrachtet. Dies löst das Problem der Kollision von Eigenschaften mit demselben Namen. Wenn wir die Bibliotheken anderer Personen erweitern und Objekte als Schlüsselnamen verwenden, müssen wir uns keine Sorgen machen, dass unsere eigenen Eigenschaften denselben Namen wie die des ursprünglichen Autors haben.

Wenn der Schlüssel der Map ein einfacher Typwert (Zahl, Zeichenfolge, Boolescher Wert) ist, behandelt die Map ihn als Schlüssel, solange die beiden Werte genau gleich sind, einschließlich 0 und - 0 . Obwohl NaN nicht genau sich selbst gleicht, behandelt Map sie außerdem als denselben Schlüssel.

let map = new Map(); 
map.set(NaN, 123); 
map.get(NaN) // 123 
map.set(-0, 123); 
map.get(+0) // 123

Ich habe das Obige für Sie zusammengestellt und hoffe, dass es Ihnen in Zukunft hilfreich sein wird.

Verwandte Artikel:

vue-cli-Konfigurationsdatei (ausführliches Tutorial)

Verwenden von jQuery zum Kapseln von animate.css (ausführliches Tutorial)

So setzen Sie den Ruhezustand in Vuex zurück

Das obige ist der detaillierte Inhalt vonDetaillierte Interpretation der Kartendatenstruktur in Javascript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!