Diterbitkan pada

Peta Hash di JavaScript: Pasangan Kunci-Nilai Berkinerja Tinggi

Penulis

Mengapa HashMap?

Yah, kita semua tahu bahwa bahasa pemrograman lain memiliki sesuatu yang disebut Hashtable. Itu adalah struktur data yang menyimpan pasangan kunci-nilai yang sangat hebat karena pencarian waktu konstan O(1) mereka. Ini adalah struktur data yang menguntungkan yang dapat kita gunakan untuk menyimpan data. Dalam JavaScript, kita tidak memiliki struktur data bawaan seperti Hashtable. Tetapi kita dapat menggunakan objek untuk menyimpan pasangan kunci-nilai. Itu disebut Map di JavaScript.

Apa itu Map?

Map adalah kumpulan elemen tempat setiap elemen disimpan sebagai pasangan Kunci, Nilai. Kunci dan nilai Map dapat berupa nilai apa pun (baik objek maupun nilai primitif). Objek Map mengulang elemennya dalam urutan penyisipan — loop for...of mengembalikan array [key, value] untuk setiap iterasi.

Map menyimpan pasangan kunci-nilai di mana kuncinya dapat berupa tipe data apa pun. Map memiliki properti yang mewakili ukuran Map. Map mengingat urutan penyisipan asli dari kunci.

Metode & Properti Map

MetodeDeskripsi
new Map()Membuat objek Map baru
set()Menetapkan nilai untuk kunci dalam Map
get()Mengembalikan nilai untuk kunci
has()Mengembalikan boolean yang menunjukkan apakah kunci ada di Map
delete()Menghapus kunci dari Map
clear()Menghapus semua kunci dari Map
values()Mengembalikan objek iterator dari nilai-nilai di Map
keys()Mengembalikan objek iterator dari kunci-kunci di Map
entries()Mengembalikan objek iterator dari pasangan kunci-nilai di Map
forEach()Menjalankan fungsi yang disediakan sekali untuk setiap pasangan kunci-nilai di Map
PropertiDeskripsi
sizeMengembalikan jumlah pasangan kunci/nilai di Map

Contoh Map

const map = new Map()
map.set('name', 'John')
map.set('age', 30)
map.set('isMarried', true)
map.set('address', { city: 'New York', state: 'NY' })
map.set('hobbies', ['reading', 'writing', 'coding'])

console.log(map.get('name')) // John
console.log(map.get('age')) // 30
console.log(map.get('isMarried')) // true
console.log(map.get('address')) // {city: 'New York', state: 'NY'}
console.log(map.get('hobbies')) // ['reading', 'writing', 'coding']

console.log(map.size) // 5

Iterasi Map

const map = new Map()
map.set('name', 'John')
map.set('age', 30)
map.set('isMarried', true)
map.set('address', { city: 'New York', state: 'NY' })
map.set('hobbies', ['reading', 'writing', 'coding'])

// Iterasi kunci
for (const key of map.keys()) {
  console.log(key)
}

// Iterasi nilai
for (const value of map.values()) {
  console.log(value)
}

// Iterasi pasangan kunci-nilai
for (const [key, value] of map.entries()) {
  console.log(key, value)
}

// Iterasi pasangan kunci-nilai
map.forEach((value, key) => {
  console.log(key, value)
})

Map vs. Object

MapObject
Map adalah kumpulan item data yang diberi kunci, seperti Objek. Tetapi perbedaan utamanya adalah Map memungkinkan kunci dari tipe apa pun.Kunci Objek harus berupa string atau simbol.
Map dapat diulang dan dapat dengan mudah diulang.Objek tidak dapat diulang dan tidak dapat dengan mudah diulang.
Map memiliki metode forEach bawaan, sehingga tidak perlu mengonversinya ke array.Objek tidak memiliki metode forEach bawaan.
Map memiliki properti ukuran, sehingga kita dapat dengan mudah mendapatkan jumlah item.Objek tidak memiliki properti ukuran.
Map dapat menggunakan objek sebagai kunci.Objek tidak dapat menggunakan objek sebagai kunci.
Map lebih cepat daripada Object secara umum.Objek umumnya lebih lambat daripada Map.

Kesimpulan

Dalam artikel ini, kita telah mempelajari tentang Map di JavaScript. Kita telah mempelajari tentang metode dan properti Map. Kita juga telah mengetahui tentang perbedaan antara Map dan Object. Saya harap Anda menikmati artikel ini. Jika Anda memiliki pertanyaan, silakan tinggalkan komentar di bawah. Terima kasih telah membaca.

Asli diposting di: https://blog.imam.dev/blog/javascript-hashmap

Referensi

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map

https://www.freecodecamp.org/news/what-is-a-javascript-map-what-are-the-differences-between-map-and-object-in-javascript/

https://www.geeksforgeeks.org/map-vs-object-javascript/