Heim > Web-Frontend > js-Tutorial > Hauptteil

Karte in JS

WBOY
Freigeben: 2024-07-19 15:06:58
Original
575 人浏览过

Map in JS

Eine Karte in JavaScript ist eine Sammlung von Schlüssel-Wert-Paaren, wobei Schlüssel von beliebigem Typ sein können. Die Reihenfolge des Einfügens wird beibehalten, was bedeutet, dass die Elemente in der Reihenfolge iteriert werden, in der sie hinzugefügt wurden.

Hauptmerkmale einer Karte;

  1. Einzigartige Schlüssel: Jeder Schlüssel in einer Karte ist einzigartig.
  2. Beliebiger Datentyp für Schlüssel: Im Gegensatz zu Objekten können Schlüssel jeden Datentyp haben, einschließlich Funktionen, Objekte oder jeden primitiven Typ.
  3. Iterierbar: Sie können über die Schlüssel, Werte oder Einträge einer Map.
  4. iterieren

Grundoperationen

Erstellen einer Karte

let funnyMap = new Map();
Nach dem Login kopieren

Elemente zu einer Karte hinzufügen

funnyMap.set('a', 1); // string key
funnyMap.set(2, 'two'); // number key
funnyMap.set(true, 'yes'); // boolean key
funnyMap.set({name: 'obj'}, 'object'); // object key

// Funny example
funnyMap.set('knock-knock', 'who’s there?');
Nach dem Login kopieren

Werte aus einer Karte abrufen

console.log(funnyMap.get('a')); // 1
console.log(funnyMap.get(2)); // two
console.log(funnyMap.get(true)); // yes

// Funny example
console.log(funnyMap.get('knock-knock')); // who’s there?
Nach dem Login kopieren

Suche nach einem Schlüssel

console.log(funnyMap.has('a')); // true
console.log(funnyMap.has(42)); // false

// Funny example
console.log(funnyMap.has('chicken')); // false (It crossed the road)
Nach dem Login kopieren

Ein Element entfernen

funnyMap.delete('a');
console.log(funnyMap.has('a')); // false

// Funny example
funnyMap.delete('knock-knock');
console.log(funnyMap.get('knock-knock')); // undefined (No one answered)
Nach dem Login kopieren

Ermitteln der Größe der Karte

console.log(funnyMap.size); // 3 after deletion

// Funny example
console.log(`The map has ${funnyMap.size} jokes left.`);
Nach dem Login kopieren

Löschen der Karte

funnyMap.clear();
console.log(funnyMap.size); // 0

// Funny example
console.log(`All jokes are cleared from the map.`);
Nach dem Login kopieren

Iterieren über eine Karte

Verwendung für...von

funnyMap.set('banana', 'yellow');
funnyMap.set('apple', 'red');
funnyMap.set('grape', 'purple');

// Iterating over keys
for (let key of funnyMap.keys()) {
    console.log(`Key: ${key}`);
}

// Iterating over values
for (let value of funnyMap.values()) {
    console.log(`Value: ${value}`);
}

// Iterating over entries
for (let [key, value] of funnyMap.entries()) {
    console.log(`Key: ${key}, Value: ${value}`);
}

// Funny example
funnyMap.set('dad joke', 'What do you call fake spaghetti? An impasta!');
for (let [key, value] of funnyMap.entries()) {
    console.log(`Here’s a ${key}: ${value}`);
}
Nach dem Login kopieren

Verwendung von forEach

funnyMap.forEach((value, key) => {
    console.log(`Key: ${key}, Value: ${value}`);
});

// Funny example
funnyMap.set('bad pun', 'I’m reading a book on anti-gravity. It’s impossible to put down!');
funnyMap.forEach((value, key) => {
    console.log(`Here’s a ${key}: ${value}`);
});
Nach dem Login kopieren

Praktische Anwendungen

Wortzählen (lustige Version)

Stellen Sie sich vor, Sie möchten zählen, wie oft bestimmte Wörter in einer Witzsammlung vorkommen:

let jokeText = "Why did the scarecrow win an award? Because he was outstanding in his field!";

// Splitting text into words
let words = jokeText.split(/\W+/);

let wordCount = new Map();

words.forEach(word => {
    word = word.toLowerCase();
    if (wordCount.has(word)) {
        wordCount.set(word, wordCount.get(word) + 1);
    } else {
        wordCount.set(word, 1);
    }
});

wordCount.forEach((count, word) => {
    console.log(`Word: ${word}, Count: ${count}`);
});

// Funny example
console.log('Word counts in our joke:');
wordCount.forEach((count, word) => {
    console.log(`"${word}": ${count} times`);
});
Nach dem Login kopieren

Zusammenfassung

Eine Karte in JavaScript ist eine vielseitige Datenstruktur, die Schlüssel-Wert-Paare jedes Datentyps enthalten kann, einfache Iterationsmethoden bietet und die Reihenfolge der Elemente beibehält. Dies ist nützlich für Szenarien, in denen Sie eine flexiblere Schlüsselverwaltung als bei einem normalen Objekt benötigen, z. B. beim Zählen von Wörtern in Witzen oder beim Speichern von Antworten auf verschiedene Rätsel.

以上是Karte in JS的详细内容。更多信息请关注PHP中文网其他相关文章!

Quelle:dev.to
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!