Peta dalam JS

WBOY
Lepaskan: 2024-07-19 15:06:58
asal
575 人浏览过

Map in JS

A Map in JavaScript is a collection of key-value pairs where keys can be of any type. It retains the order of insertion, meaning that the items are iterated in the order they were added.

Key Characteristics of a Map;

  1. Unique Keys: Each key in a Map is unique.
  2. Any Data Type for Keys: Unlike objects, keys can be of any data type, including functions, objects, or any primitive type.
  3. Iterable: You can iterate over the keys, values, or entries of a Map.

Basic Operations

Creating a Map

let funnyMap = new Map();
Salin selepas log masuk

Adding Elements to a Map

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?');
Salin selepas log masuk

Getting Values from a Map

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?
Salin selepas log masuk

Checking for a Key

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

// Funny example
console.log(funnyMap.has('chicken')); // false (It crossed the road)
Salin selepas log masuk

Removing an Element

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)
Salin selepas log masuk

Getting the Size of the Map

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

// Funny example
console.log(`The map has ${funnyMap.size} jokes left.`);
Salin selepas log masuk

Clearing the Map

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

// Funny example
console.log(`All jokes are cleared from the map.`);
Salin selepas log masuk

Iterating Over a Map

Using for...of

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}`);
}
Salin selepas log masuk

Using 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}`);
});
Salin selepas log masuk

Practical Uses

Word Counting (Funny Version)

Imagine you want to count how many times certain words appear in a joke collection:

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`);
});
Salin selepas log masuk

Summary

A Map in JavaScript is a versatile data structure that can hold key-value pairs of any data type, provides easy iteration methods, and maintains the order of elements. It's useful for scenarios where you need a more flexible key management than a regular object, such as counting words in jokes or storing responses to various riddles.

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

sumber:dev.to
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!