DEV Community

Cover image for Map & Set - JavaScript
boibolang
boibolang

Posted on

Map & Set - JavaScript

Selain array dan object, di JavaScript juga ada tipe data yang hampir sama yaitu set dan map. Array hampir sama dengan set, yaitu kumpulan nilai yang mempunyai index berurutan, bedanya adalah pada set tidak diperbolehkan ada nilai yang sama/ganda/berulang. Object hampir sama dengan map, bedanya tipe data key pada object harus selalu string sedangkan pada map semua tipe data diperbolehkan untuk dijadikan key termasuk object.

MAP

Inisiasi/pembuatan map.

const map = new Map();
map.set('nama', 'John Doe');
map.set(1, 'Sepeda Balap');
map.set('1', 'Sepeda Motor');
console.log(map);
console.log(map.get('nama')); // mengambil nilai map
Enter fullscreen mode Exit fullscreen mode

result

Chaining dengan map.

map.set(2, 'Makan').set('3', 'Ikan Gabus');
console.log(map);
Enter fullscreen mode Exit fullscreen mode

result

Perulangan/iterasi dengan map.

// Map.keys() mengembalikan key
for (const key of map.keys()) {
  console.log(key, typeof(key));
}
Enter fullscreen mode Exit fullscreen mode

result

// Map.values() mengembalikan nilai
for (const value of map.values()) {
  console.log(value);
}
Enter fullscreen mode Exit fullscreen mode

result

// Map.entries() mengembalikan pasangan key-value
for (const [key, value] of map.entries()) {
  console.log(key, value);
}
Enter fullscreen mode Exit fullscreen mode

result

// Map.entries() mengembalikan pasangan key-value berupa array
for (const entries of map.entries()) {
  console.log(entries);
}
Enter fullscreen mode Exit fullscreen mode

result

Kita bisa membuat map dari array, caranya dengan memasukkan pasangan value-value pada array yang nantinya akan dikonversi menjadi pasangan key-value pada map.

let map2 = new Map([
  [1, 'John'],
  ['1', 'Celine'],
  [true, 'Hanson'],
]);
console.log(map2);
for (const key of map2.keys()) {
  console.log(key, typeof key);
}
Enter fullscreen mode Exit fullscreen mode

result

Membuat map dair object.

let obj4 = {
  nama: 'John Doe',
  umur: 30,
};
let mapObj = new Map(Object.entries(obj4));
// Object.entries() mengembalikan pasangan key-value sesuai untuk pembuatan map
console.log(mapObj);
Enter fullscreen mode Exit fullscreen mode

result

Sebaliknya kita juga bisa membuat object dari map dengan mamasukkan array value-value.

let objMap = Object.fromEntries([
  ['name', 'John Doe'],
  ['umur', 30],
  ['status', 'menikah'],
]);
console.log(objMap);
console.log(typeof objMap);
Enter fullscreen mode Exit fullscreen mode

result

SET

Inisiasi/pembuatan set.

let menu = new Set(['Soto', 'Pecel', 'Rendang', 'Coto', 'Soto', 'soto']);
console.log(menu);
menu.add('Tempe penyet');
console.log(menu);
Enter fullscreen mode Exit fullscreen mode

result

Pada contoh diatas terlihat bahwa ‘Soto’ meskipun ditulis 2 kali namun hanya ditampilkan 1 kali. Sedangkan ‘soto’ tetap ditampilkan karena ‘Soto’ berbeda dengan ‘soto’.

Perulangan/iterasi dengan set.

for (const key of menu) {
  console.log(key);
}

for (const key of menu.values()) {
  console.log(key);
}
// Set.keys() dan Set.values() menghasilkan output yang sama karena set tidak memiliki key

// Hasil berupa array
for (const entries of menu.entries()) {
  console.log(entries);
}

// Hasil berupa pasangan value-value
for (const [key, value] of menu.entries()) {
  console.log(key, value);
}
Enter fullscreen mode Exit fullscreen mode

Top comments (0)