Rumah  >  Artikel  >  hujung hadapan web  >  Peta dalam JS

Peta dalam JS

WBOY
WBOYasal
2024-07-19 15:06:58810semak imbas

Map in JS

Peta dalam JavaScript ialah koleksi pasangan nilai kunci yang mana kunci boleh terdiri daripada sebarang jenis. Ia mengekalkan susunan sisipan, bermakna item itu diulang mengikut susunan ia ditambahkan.

Ciri-ciri Utama Peta;

  1. Kunci Unik: Setiap kunci dalam Peta adalah unik.
  2. Sebarang Jenis Data untuk Kekunci: Tidak seperti objek, kunci boleh terdiri daripada sebarang jenis data, termasuk fungsi, objek atau sebarang jenis primitif.
  3. Boleh Diulang: Anda boleh mengulangi kekunci, nilai atau entri Peta.

Operasi Asas

Mencipta Peta

let funnyMap = new Map();

Menambah Elemen pada Peta

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?');

Mendapatkan Nilai daripada Peta

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?

Menyemak Kunci

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

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

Mengalih keluar Elemen

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)

Mendapatkan Saiz Peta

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

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

Membersihkan Peta

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

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

Mengulangi Peta

Menggunakan untuk...daripada

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}`);
}

Menggunakan 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}`);
});

Kegunaan Praktikal

Pengiraan Perkataan (Versi Lucu)

Bayangkan anda ingin mengira berapa kali perkataan tertentu muncul dalam koleksi jenaka:

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`);
});

Ringkasan

Peta dalam JavaScript ialah struktur data serba boleh yang boleh menyimpan pasangan nilai kunci bagi sebarang jenis data, menyediakan kaedah lelaran yang mudah dan mengekalkan susunan elemen. Ia berguna untuk senario di mana anda memerlukan pengurusan kunci yang lebih fleksibel daripada objek biasa, seperti mengira perkataan dalam jenaka atau menyimpan respons kepada pelbagai teka-teki.

Atas ialah kandungan terperinci Peta dalam JS. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
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