Kumpulan javascript vs kinerja peta

Array, peta, dan set. 3 dari struktur data terpenting dalam Javascript dan di permukaan, 3 ini terlihat lebih mirip daripada berbeda dalam hal apa yang mereka lakukan dan untuk apa mereka digunakan. Tetapi ketika Anda melihat lebih dekat pada setiap struktur data, seperti yang akan kita lakukan di artikel ini, Anda akan melihat bahwa setiap struktur data memiliki kasus penggunaan yang berbeda sehingga optimal untuk mereka. Tanpa mencari solusi menggunakan banyak array yang sudah dikenal untuk setiap masalah yang Anda temui, memahami perbedaan dan kasus penggunaan dari masing-masing struktur data ini akan memberi Anda kemampuan untuk menghasilkan solusi optimal dengan menggunakan struktur data terbaik untuk kasus tertentu tersebut

Pertama, mari kita lihat apa masing-masing struktur data ini

Array

Array adalah struktur data yang menyimpan data jenis apa pun dalam objek Javascript seperti daftar. Anda dapat membuat array dengan mendeklarasikannya secara eksplisit seperti pada contoh di bawah ini

let arr = [1, 2, 'fruit', { id: 1, name: 'charlie' }, ['a', 'b']]

Setiap item dalam array memiliki indeks mulai dari 0. Anda dapat mengakses setiap item menggunakan indeksnya

arr[0] // 1
arr[4] // ['a', 'b']

Anda dapat mengubah nilai item pada indeks tertentu

arr[3] = 9 // arr = [1, 2, 'fruit', 9, ['a', 'b']]

Dapatkan indeks item array berdasarkan nilainya

arr.indexOf('fruit') // 2

Anda dapat menambahkan item ke array kosong atau tidak kosong menggunakan salah satu metode berikut

//add item to the end of the array
arr.push('vegetable') // arr = [1, 2, 'fruit', 9, ['a', 'b'], 'vegetable']
arr[6] = 2 // arr = [1, 2, "fruit", 9, ['a', 'b'], 'vegetable', 2]

Peta

Peta adalah objek yang menyimpan item sebagai pasangan kunci-nilai. Kunci dapat berupa tipe data apa pun asalkan setiap kunci unik. Nilai juga bisa berupa tipe data apa pun, tetapi tidak harus unik. Untuk membuat objek peta baru, Anda perlu memanggil konstruktornya

let mapObj = new Map()

Gunakan Peta. prototipe. set(key, value) untuk menambahkan pasangan kunci-nilai baru ke objek peta

//mapObj.set(key, value)
mapObj.set(1, "cat")
mapObj.set('name', 'smith')

Anda dapat mengakses nilai yang disimpan di peta menggunakan kunci dan Petanya. prototipe. dapatkan (kunci) metode

//mapObj.get(key)
mapObj.get('name') // 'smith'

Anda dapat menggunakan metode set sebelumnya untuk mengubah nilai item yang disimpan

mapObj.set(1, 'dog')
mapObj.get(1)  // 'dog'

Mengatur

Set adalah objek yang menyimpan kumpulan nilai. Setiap nilai yang disimpan dalam satu set adalah unik dan dapat berupa tipe data apa pun. Sebuah set dibuat menggunakan konstruktor set

let setObj = new Set()

Menambahkan nilai ke set dilakukan dengan menggunakan Set. prototipe. menambahkan (nilai) metode

arr[0] // 1
arr[4] // ['a', 'b']

Sekarang Anda telah memiliki pengantar yang tepat untuk masing-masing dari 3 struktur data, mari kita lihat bagaimana susunan vs peta vs adil dalam skenario yang berbeda

Array bukanlah Benda Padat

Perhatikan contoh berikut

arr[0] // 1
arr[4] // ['a', 'b']

Dalam skenario di atas, meskipun indeks akhir dari objek arr awal adalah 3, menetapkan nilai ke indeks 6 dapat diterapkan tanpa menimbulkan kesalahan. Dua indeks antara 3 dan 6, yang tidak diberi nilai, tampak kosong di larik yang dihasilkan. Ini karena array belum tentu padat. Anda dapat menambah panjang array dengan penetapan nilai seperti pada kasus di atas, sambil tetap memiliki slot kosong di antara indeks pertama dan terakhir

arr[0] // 1
arr[4] // ['a', 'b']

Apakah array tetap padat atau tidak pada akhirnya adalah pilihan programmer dan use case yang digunakan untuk itu

Anda dapat menganggap set dan peta padat secara default karena strukturnya tidak memungkinkan skenario seperti di atas terjadi. Ukurannya sama dengan jumlah item yang disimpan dalam objek

arr[0] // 1
arr[4] // ['a', 'b']

Mengambil Item Tunggal

Meskipun peta dan larik menyediakan metode untuk mengambil item tunggal secara langsung menggunakan kunci, indeks, atau nilai, metode seperti itu tidak tersedia untuk kumpulan

arr[0] // 1
arr[4] // ['a', 'b']

Satu-satunya cara untuk mengambil nilai dalam satu set adalah dengan mengulanginya. Untuk kasus penggunaan yang memerlukan akses langsung dan mudah ke nilainya, set tidak cocok

Menggunakan Array untuk Membuat Peta dan Set

Array dapat digunakan dalam membuat peta dan set. Konstruktor kelas Map dan Set menerima objek Iterable (seperti array) sebagai argumen

Pertama, mari kita lihat cara membuat satu set menggunakan array

arr[0] // 1
arr[4] // ['a', 'b']

Untuk membuat Peta, kita membutuhkan array 2 dimensi (array of arrays). Jika setiap larik dalam dimensi ke-2 memiliki panjang 2, nilai pada indeks 0 dari setiap larik menjadi kunci dan nilai pada indeks 1 menjadi nilai. Jika tidak, peta baru masih dibuat, dengan beberapa pasangan kunci-nilai ganjil. Jika nilai pada dua indeks nol dalam larik tingkat ke-2 sama, larik yang datang ke-2 menggantikan nilai yang disimpan di bawah kunci itu

arr[0] // 1
arr[4] // ['a', 'b']

Menyimpan Duplikat

Secara default, set tidak menyimpan nilai duplikat. Karena setiap kunci dalam peta unik, kunci duplikat juga tidak dapat disimpan. Namun, array cenderung menyimpan duplikat. Tentu saja, itu tergantung pada kasus penggunaan apakah menyimpan duplikat adalah hal yang baik atau buruk, dan itu akan membantu Anda memutuskan struktur data mana yang akan digunakan untuk acara tersebut.

Iterasi Menggunakan for…in dan forEach

Array, peta, dan set dapat diulang menggunakan for…of loop. Dalam larik dan set, loop beriterasi pada nilai yang disimpan, dan di peta, loop beriterasi pada setiap pasangan kunci-nilai. Di set dan peta, iterasi terjadi dalam urutan penyisipan. Dalam array, iterasi terjadi dalam urutan indeks

arr[0] // 1
arr[4] // ['a', 'b']

Anda juga dapat melakukan iterasi hanya pada kunci atau nilai peta dengan perulangan for…of

arr[0] // 1
arr[4] // ['a', 'b']

forEach juga dapat digunakan untuk mengulangi 3 struktur data ini

arr[0] // 1
arr[4] // ['a', 'b']

Menghapus Elemen

Array, peta, dan set memiliki metode untuk menghapus item yang disimpan dari objek. Metode penghapusan agak mirip di peta dan set

arr[3] = 9 // arr = [1, 2, 'fruit', 9, ['a', 'b']]

Array menggunakan Array. prototipe. splice() metode untuk menghapus item dari array

arr[3] = 9 // arr = [1, 2, 'fruit', 9, ['a', 'b']]

Pada kode di atas, parameter pertama dari metode sambatan adalah indeks posisi untuk mulai menghapus item. Parameter kedua mengatakan berapa banyak item dari awal yang harus dihapus

Menghapus item dari array menggunakan nilai item cukup lambat dibandingkan dengan operasi hapus set atau peta

Penggunaan NaN

Dalam Javascript, NaN. == NaN adalah pernyataan yang benar. Namun, dalam set dan peta, algoritme yang digunakan untuk menentukan persamaan nilai dan persamaan kunci, masing-masing, menganggap NaN sama dengan NaN (terdengar aneh, saya tahu). Karena itu, NaN dapat digunakan sebagai kunci unik di peta dan nilai unik di set (di mana keunikan kunci atau nilai diperiksa). Array dapat menyimpan NaN sebagai nilai tanpa pertimbangan kesetaraan karena nilai array tidak harus unik

Kesimpulan

Sekarang Anda tahu apa itu array, peta, dan set serta perbedaannya, Anda dapat menggunakan pengetahuan ini dengan tepat saat memprogram. Saat Anda menghadapi masalah yang memerlukan penggunaan struktur data, luangkan waktu sejenak untuk memikirkan mana dari 3 ini, atau struktur data lain yang Anda ketahui, yang paling sesuai dengan tugas yang ada. Ini akan membuat program Anda lebih cepat, lebih bersih, dan lebih optimal dari sebelumnya.  

Apakah Ditetapkan lebih cepat dari objek JavaScript?

Kapan menggunakan Set atau peta dalam JavaScript?

Apakah peta lebih cepat daripada objek JavaScript?

Apakah Peta JavaScript lambat?