ES6 - Koleksi

ES6 memperkenalkan dua struktur data baru: Peta dan Set.

  • Maps - Struktur data ini memungkinkan pemetaan kunci ke suatu nilai.

  • Sets- Set mirip dengan array. Namun, set tidak mendorong duplikasi.

Maps

Objek Map adalah pasangan kunci / nilai sederhana. Kunci dan nilai dalam peta mungkin primitif atau objek.

Berikut ini adalah sintaks yang sama.

new Map([iterable])

Parameter iterable mewakili objek iterable yang elemennya terdiri dari pasangan kunci / nilai. Peta diurutkan, yaitu melintasi elemen dalam urutan penyisipannya.

Properti Peta

Sr Tidak Deskripsi properti
1 Map.prototype.size

Properti ini mengembalikan jumlah pasangan kunci / nilai di objek Peta.

Memahami operasi Peta dasar

Fungsi set () menyetel nilai untuk kunci dalam objek Peta. Fungsi set () mengambil dua parameter yaitu, kunci dan nilainya. Fungsi ini mengembalikan objek Peta.

Fungsi has () mengembalikan nilai boolean yang menunjukkan apakah kunci yang ditentukan ditemukan dalam objek Map. Fungsi ini mengambil kunci sebagai parameter.

var map = new Map(); 
map.set('name','Tutorial Point'); 
map.get('name'); // Tutorial point

Contoh di atas membuat objek peta. Peta hanya memiliki satu elemen. Kunci elemen dilambangkan denganname. Kunci dipetakan ke sebuah nilaiTutorial point.

Note- Peta membedakan antara nilai yang serupa tetapi memiliki tipe data yang berbeda. Dengan kata lain, sebuahinteger key 1 dianggap berbeda dari a string key “1”. Pertimbangkan contoh berikut untuk lebih memahami konsep ini

var map = new Map(); 
map.set(1,true); 
console.log(map.has("1")); //false 
map.set("1",true); 
console.log(map.has("1")); //true

Keluaran

false 
true

Itu set()metode juga dapat dirantai. Perhatikan contoh berikut.

var roles = new Map(); 
roles.set('r1', 'User') 
.set('r2', 'Guest') 
.set('r3', 'Admin'); 
console.log(roles.has('r1'))

Keluaran

True

Contoh di atas, mendefinisikan objek peta. Contoh rantai fungsi set () untuk mendefinisikan pasangan kunci / nilai.

Itu get() fungsi digunakan untuk mengambil nilai yang sesuai dengan kunci yang ditentukan.

Konstruktor Peta juga dapat melewati larik. Selain itu, peta juga mendukung penggunaan operator sebaran untuk merepresentasikan sebuah array.

Contoh

var roles = new Map([ 
   ['r1', 'User'], 
   ['r2', 'Guest'], 
   ['r3', 'Admin'], 
]);  
console.log(roles.get('r2'))

Output berikut ditampilkan pada eksekusi yang berhasil dari kode di atas.

Guest

Note - Fungsi get () mengembalikan tidak terdefinisi jika kunci yang ditentukan tidak ada di peta.

Set () menggantikan nilai kunci, jika sudah ada di peta. Perhatikan contoh berikut.

var roles = new Map([ 
   ['r1', 'User'], 
   ['r2', 'Guest'], 
   ['r3', 'Admin'], 
]);  
console.log(`value of key r1 before set(): ${roles.get('r1')}`) 
roles.set('r1','superUser') 
console.log(`value of key r1 after set(): ${roles.get('r1')}`)

Output berikut ditampilkan pada eksekusi yang berhasil dari kode di atas.

value of key r1 before set(): User 
value of key r1 after set(): superUser

Metode Peta

Sr Tidak Metode & Deskripsi
1 Map.prototype.clear ()

Menghapus semua pasangan kunci / nilai dari objek Peta.

2 Map.prototype.delete (kunci)

Menghapus nilai apa pun yang terkait dengan kunci dan mengembalikan nilai yang akan dikembalikan Map.prototype.has (key) sebelumnya.

Map.prototype.has (key) akan mengembalikan false setelahnya.

3 Map.prototype.entries ()

Mengembalikan objek Iterator baru yang berisi an array of [key, value] untuk setiap elemen di objek Map dalam urutan penyisipan.

4 Map.prototype.forEach (callbackFn [, thisArg])

Panggilan callbackFnsekali untuk setiap pasangan nilai kunci yang ada di objek Peta, dalam urutan penyisipan. Jika parameter thisArg diberikan ke forEach, itu akan digunakan sebagai nilai 'this' untuk setiap callback.

5 Map.prototype.keys ()

Mengembalikan objek Iterator baru yang berisi keys untuk setiap elemen di objek Peta dalam urutan penyisipan.

6 Map.prototype.values ​​()

Mengembalikan objek Iterator baru yang berisi an array of [key, value] untuk setiap elemen di objek Map dalam urutan penyisipan.

Untuk… Loop

Contoh berikut mengilustrasikan melintasi peta menggunakan for… of loop.

'use strict' 
var roles = new Map([ 
   ['r1', 'User'], 
   ['r2', 'Guest'], 
   ['r3', 'Admin'], 
]);
for(let r of roles.entries()) 
console.log(`${r[0]}: ${r[1]}`);

Output berikut ditampilkan pada eksekusi yang berhasil dari kode di atas.

r1: User 
r2: Guest 
r3: Admin

Peta Lemah

Peta yang lemah identik dengan peta dengan pengecualian berikut -

  • Kuncinya haruslah objek.

  • Kunci di peta yang lemah dapat dikumpulkan. Sampah. Garbage collection adalah proses membersihkan memori yang ditempati oleh objek yang tidak direferensikan dalam sebuah program.

  • Peta yang lemah tidak dapat diulang atau dihapus.

Contoh: Peta Lemah

'use strict' 
let weakMap = new WeakMap(); 
let obj = {}; 
console.log(weakMap.set(obj,"hello"));  
console.log(weakMap.has(obj));// true

Output berikut ditampilkan pada eksekusi yang berhasil dari kode di atas.

WeakMap {} 
true

Set

Satu set adalah struktur data ES6. Ini mirip dengan sebuah array dengan pengecualian yang tidak dapat berisi duplikat. Dengan kata lain, ini memungkinkan Anda menyimpan nilai unik. Set mendukung nilai primitif dan referensi objek.

Sama seperti peta, set juga diurutkan, yaitu elemen diulang dalam urutan penyisipannya. Satu set dapat diinisialisasi menggunakan sintaks berikut.

Atur Properti

Sr Tidak Deskripsi properti
1 Set.prototype.size

Mengembalikan jumlah nilai dalam objek Set.

Tetapkan Metode

Sr Tidak Metode & Deskripsi
1 Set.prototype.add (nilai)

Menambahkan elemen baru dengan nilai yang diberikan ke objek Set. Mengembalikan objek Set.

2 Set.prototype.clear ()

Menghapus semua elemen dari objek Set.

3 Set.prototype.delete (nilai)

Menghapus elemen yang terkait dengan nilai.

4 Set.prototype.entries ()

Mengembalikan objek Iterator baru yang berisi an array of[nilai, nilai] untuk setiap elemen dalam objek Set, dalam urutan penyisipan. Ini tetap sama dengan objek Map, sehingga setiap entri memiliki nilai yang sama untuk kunci dan nilainya di sini.

5 Set.prototype.forEach (callbackFn [, thisArg])

Panggilan callbackFnsekali untuk setiap nilai yang ada di objek Set, dalam urutan penyisipan. JikaathisArg parameter diberikan ke forEach, ini akan digunakan sebagai nilai 'this' untuk setiap callback.

6 Set.prototype.has (nilai)

Mengembalikan boolean yang menyatakan apakah elemen ada dengan nilai yang diberikan dalam objek Set atau tidak.

7 Set.prototype.values ​​()

Mengembalikan objek Iterator baru yang berisi values untuk setiap elemen dalam objek Set dalam urutan penyisipan.

Set Lemah

Set yang lemah hanya bisa berisi objek, dan objek yang dikandungnya mungkin sampah yang dikumpulkan. Seperti peta yang lemah, set yang lemah tidak dapat diulangi.

Contoh: Menggunakan Set Lemah

'use strict' 
   let weakSet = new WeakSet();  
   let obj = {msg:"hello"}; 
   weakSet.add(obj); 
   console.log(weakSet.has(obj)); 
   weakSet.delete(obj); 
   console.log(weakSet.has(obj));

Output berikut ditampilkan pada eksekusi yang berhasil dari kode di atas.

true 
false

Iterator

Iterator adalah sebuah objek yang memungkinkan untuk mengakses kumpulan objek satu per satu. Baik set maupun map memiliki metode yang mengembalikan iterator.

Iterator adalah objek dengan next()metode. Ketika metode next () dipanggil, ia mengembalikan objek dengan'value' dan 'done'properti. 'selesai' adalah boolean, ini akan mengembalikan nilai true setelah membaca semua item dalam koleksi

Contoh 1: Set dan Iterator

var  set = new Set(['a','b','c','d','e']);  
var iterator = set.entries(); 
console.log(iterator.next())

Output berikut ditampilkan pada eksekusi yang berhasil dari kode di atas.

{ value: [ 'a', 'a' ], done: false }

Karena, set tidak menyimpan kunci / nilai, larik nilai berisi kunci dan nilai yang serupa. done akan menjadi salah karena ada lebih banyak elemen untuk dibaca.

Contoh 2: Set dan Iterator

var  set = new Set(['a','b','c','d','e']);  
var iterator = set.values(); 
console.log(iterator.next());

Output berikut ditampilkan pada eksekusi yang berhasil dari kode di atas.

{ value: 'a', done: false }

Contoh 3: Set dan Iterator

var  set = new Set(['a','b','c','d','e']);  
var iterator = set.keys(); 
console.log(iterator.next());

Output berikut ditampilkan pada eksekusi yang berhasil dari kode di atas.

{ value: 'a', done: false }

Contoh 4: Peta dan Iterator

var map = new Map([[1,'one'],[2,'two'],[3,'three']]); 
var iterator = map.entries(); 
console.log(iterator.next());

Output berikut ditampilkan pada eksekusi yang berhasil dari kode di atas.

{ value: [ 1, 'one' ], done: false }

Contoh 5: Peta dan Iterator

var map = new Map([[1,'one'],[2,'two'],[3,'three']]); 
var iterator = map.values(); 
console.log(iterator.next());

Output berikut ditampilkan pada eksekusi yang berhasil dari kode di atas.

{value: "one", done: false}

Contoh 6: Peta dan Iterator

var map = new Map([[1,'one'],[2,'two'],[3,'three']]); 
var iterator = map.keys(); 
console.log(iterator.next());

Output berikut ditampilkan pada eksekusi yang berhasil dari kode di atas.

{value: 1, done: false}