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}