Mengapa Set?

Set ialah struktur data yang membolehkan anda menyimpan nilai unik bagi apa-apa jenis data. Ia serupa dengan array tetapi tidak membenarkan nilai pendua. Ia merupakan cara yang bagus untuk menyimpan nilai unik bagi apa-apa jenis. Kadang kala, anda mahu menyimpan nilai unik dalam array, tetapi anda tidak mahu mengulang melalui array untuk memeriksa sama ada nilai tersebut sudah wujud. Di sinilah Set berguna.

Dalam artikel sebelum ini, kita telah membincangkan Javascript Map. Set serupa dengan Map, tetapi ia hanya menyimpan kunci, bukan nilai. Ia merupakan cara yang bagus untuk menyimpan nilai unik bagi apa-apa jenis data. Memang sangat membingungkan untuk menggunakan Map dalam banyak kes. Itulah sebabnya kita akan membincangkan tentang Set.

Apakah JavaScript Set?

Objek Set ialah koleksi nilai. Nilai dalam Set hanya boleh berlaku sekali; ia adalah unik dalam koleksi Set. Anda boleh mengulang melalui elemen Set mengikut urutan penyisipan. Urutan penyisipan sepadan dengan urutan di mana setiap elemen telah dimasukkan ke dalam Set oleh kaedah add() dengan jayanya (iaitu, tidak terdapat elemen yang serupa dalam Set ketika Set memanggil add()).

Spesifikasi memerlukan set diimplementasikan "yang, secara purata, menyediakan masa akses yang sublinear pada bilangan elemen dalam koleksi." Oleh itu, ia boleh diwakili secara dalaman sebagai jadual hash (dengan carian O(1)), pokok carian (dengan carian O(log(N))), atau struktur data lain, selagi kerumitannya lebih baik daripada O(N).

Cara untuk mencipta Set?

Terdapat dua cara untuk mencipta Set. Cara pertama ialah menggunakan pembina Set. Cara kedua ialah menggunakan literal objek Set.

Pembina Set

Pembina Set mencipta objek Set yang baru. Anda boleh menghantar objek boleh ulang sebagai hujah kepada pembina. Elemen objek boleh ulang akan ditambah ke Set yang baru.

const set = new Set([1, 2, 3, 4, 5])

Literal Objek Set

Literal objek Set mencipta objek Set yang baru. Anda boleh menghantar objek boleh ulang sebagai hujah kepada literal objek. Elemen objek boleh ulang akan ditambah ke Set yang baru.

const set = {1, 2, 3, 4, 5};

Kaedah & Sifat Set

Kaedah	Penerangan
add()	Menambah elemen baru dengan nilai yang ditentukan kepada objek Set.
clear()	Mengalih keluar semua elemen daripada objek Set.
delete()	Mengalih keluar elemen yang dikaitkan dengan nilai dan mengembalikan nilai yang akan dikembalikan oleh Set.prototype.has(value) sebelum ini. Set.prototype.has(value) akan mengembalikan false selepas itu.
entries()	Mengembalikan objek Iterator baru yang mengandungi array [value, value] bagi setiap elemen dalam objek Set, mengikut urutan penyisipan.
forEach()	Menjalankan fungsi yang diberikan sekali bagi setiap nilai dalam objek Set, mengikut urutan penyisipan.
has()	Mengembalikan boolean yang menegaskan sama ada elemen wujud dengan nilai yang diberikan dalam objek Set.
keys()	Mengembalikan objek Iterator baru yang mengandungi nilai bagi setiap elemen dalam objek Set mengikut urutan penyisipan.
values()	Mengembalikan objek Iterator baru yang mengandungi nilai bagi setiap elemen dalam objek Set mengikut urutan penyisipan.

Sifat	Penerangan
size	Mengembalikan bilangan nilai dalam objek Set.

Contoh Set

Tambah nilai kepada Set

const set = new Set([1, 2, 3, 4, 5])
set.add(6)
console.log(Set) // Set { 1, 2, 3, 4, 5, 6 }

Padam nilai daripada Set

const set = new Set([1, 2, 3, 4, 5])
set.delete(3)
console.log(set) // Set { 1, 2, 4, 5 }

Semak sama ada nilai wujud dalam Set

const set = new Set([1, 2, 3, 4, 5])
console.log(set.has(3)) // true

Ulang melalui Set

const set = new Set([1, 2, 3, 4, 5])
for (const item of Set) {
  console.log(item)
}
// 1
// 2
// 3
// 4
// 5

Tukar Set kepada Array

const set = new Set([1, 2, 3, 4, 5])
const array = Array.from(set)
console.log(array) // [1, 2, 3, 4, 5]

Tukar Array kepada Set

const Array = [1, 2, 3, 4, 5]
const set = new Set(array)
console.log(Set) // Set { 1, 2, 3, 4, 5 }

Dapatkan saiz Set

const set = new Set([1, 2, 3, 4, 5])
console.log(set.size) // 5

Kosongkan Set

const set = new Set([1, 2, 3, 4, 5])
set.clear()
console.log(set) // Set {}

Gabungkan Set

const set1 = new Set([1, 2, 3, 4, 5])
const set2 = new Set([6, 7, 8, 9, 10])
const set3 = new Set([...set1, ...set2])
console.log(set3) // Set { 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 }

Dapatkan persilangan dua Set

const set1 = new Set([1, 2, 3, 4, 5])
const set2 = new Set([4, 5, 6, 7, 8])
const set3 = new Set([...set1].filter((x) => set2.has(x)))
console.log(set3) // Set { 4, 5 }

Dapatkan perbezaan antara dua Set

const set1 = new Set([1, 2, 3, 4, 5])
const set2 = new Set([4, 5, 6, 7, 8])
const set3 = new Set([...set1].filter((x) => !set2.has(x)))
console.log(set3) // Set { 1, 2, 3 }

Semak sama ada Set adalah subset Set lain

const set1 = new Set([1, 2, 3, 4, 5])
const set2 = new Set([4, 5])
console.log([...set2].every((x) => set1.has(x))) // true

Semak sama ada Set adalah superset Set lain

const set1 = new Set([1, 2, 3, 4, 5])
const set2 = new Set([4, 5])
console.log([...set1].every((x) => set2.has(x))) // false

Semak sama ada dua Set adalah asing

const set1 = new Set([1, 2, 3, 4, 5])
const set2 = new Set([6, 7, 8, 9, 10])
console.log([...set1].every((x) => !set2.has(x))) // true

Semak sama ada dua Set adalah sama

const set1 = new Set([1, 2, 3, 4, 5])
const set2 = new Set([1, 2, 3, 4, 5])
console.log(set1.size === set2.size && [...set1].every((x) => set2.has(x))) // true

Sokongan Pelayar

Chrome	Firefox	Edge	Safari	Opera
49+	44+	12+	10.1+	36+

Set vs. Array

Set	Array
Nilai unik, tidak membenarkan nilai pendua	Membenarkan nilai pendua
Set ialah koleksi nilai tanpa susunan tertentu	Array ialah koleksi nilai mengikut susunan tertentu
Set boleh ulang	Array boleh ulang
Set lebih perlahan daripada array dalam inisialisasi kerana ia menggunakan proses hash.	Array lebih pantas dari segi inisialisasi
Prestasi lebih baik ketika memeriksa kewujudan elemen	Prestasi lebih baik ketika mengakses elemen

Artikel ini pada asalnya diterbitkan di blog.imam.dev.

Set JavaScript: Pengenalan untuk Pemrogram Pemula