Array adalah struktur data yang sangat kuat dan sangat fleksibel yang pasti Anda gunakan dalam kode JavaScript Anda. Tetapi apakah Anda menggunakannya secara efisien?
Ada beberapa metode yang dapat Anda gunakan untuk mengoptimalkan array JavaScript untuk kinerja dan efisiensi yang lebih baik. Salah satu struktur data yang paling sering digunakan dalam JavaScript adalah array. Ini adalah pilihan populer bagi banyak pengembang karena sangat fleksibel dan mudah digunakan.
Namun, array dapat dengan cepat menjadi hambatan kinerja jika Anda tidak menggunakannya dengan benar. Berikut adalah lima cara Anda dapat mengoptimalkan susunan JavaScript dan meningkatkan kinerja kode secara keseluruhan.
1. Gunakan Operator Penyebaran
Anda dapat membuat array baru yang berisi elemen dari yang lain dengan operator spread, yaitu tiga titik (...).
Operator spread dapat menggabungkan dua array, seperti ini:
const larik1 = [1, 2, 3];
const larik2 = [4, 5, 6];
const concatenatedArray = [...array1, ...array2];
menghibur.log (ConcatenatedArray); // Keluaran: [1, 2, 3, 4, 5, 6]
Dalam hal ini, operator spread menggabungkan dua larik—array1 dan larik2—ke dalam larik baru yang disebut ConcatenatedArray. Array yang dihasilkan berisi semua elemen array1 diikuti oleh semua elemen array2.
Operator spread juga dapat membuat array baru dengan lebih banyak elemen. Contohnya:
const Array asli = [1, 2, 3];
const newArray = [...array asli, 4, 5];
menghibur.log (BaruArray); // Keluaran: [1, 2, 3, 4, 5]
Anda membuat array baru bernama newArray dengan menggunakan operator spread. Ini berisi semua elemen array asli, diikuti oleh elemen 4 dan 5. Saat berhadapan dengan array besar, operator spread mungkin lebih efektif daripada metode sejenisnya concat() atau dorongan(). Selain itu, itu membuat kode lebih mudah dibaca dan ringkas.
Anda dapat menggunakan larik JavaScript secara lebih efisien dengan operator spread, yang juga mempermudah pembuatan larik baru dengan lebih banyak item.
2. Hindari Menggunakan Operator Hapus
Anda dapat menghapus properti objek menggunakan operator hapus. Meskipun Anda dapat menggunakan delete untuk menghapus elemen array, ini tidak disarankan karena dapat meninggalkan ruang kosong atau kosong di dalam array. Ini dapat memengaruhi kinerja larik saat Anda mengulanginya atau mencoba mengakses elemen tertentu.
Alih-alih menggunakan menghapus operator, pertimbangkan untuk menggunakan sambatan metode. Metode ini dapat menghapus elemen array dan akan mengembalikan array baru tanpa ruang kosong.
Anda dapat menggunakan sambatan metode dengan cara berikut:
const Array asli = [1, 2, 3, 4, 5];
// Hapus elemen pada indeks 2
const newArray = originalArray.splice(2, 1);
Contoh ini menghapus elemen pada indeks 2 dari originalArray menggunakan metode sambatan. Array yang baru dibuat (Array baru) mengandung elemen yang sambatan dihapus. Elemen pada indeks 2 tidak lagi ada di originalArray, dan tidak ada ruang kosong dalam larik.
3. Gunakan Array yang Diketik
Dalam JavaScript, Anda dapat bekerja dengan data biner menggunakan array yang diketik. Array ini memungkinkan manipulasi langsung dari memori yang mendasarinya dan menggunakan elemen dengan panjang tetap; mereka lebih efisien daripada array standar.
Berikut adalah contoh cara membuat array yang diketik:
const myArray = baruInt16Array(4);
menghibur.log (MyArray); // Keluaran: Int16Array [0, 0, 0, 0]
Contoh ini menciptakan merek baru Int16Array dengan empat elemen diatur ke nol.
Int8Array, Int16Array, Int32Array, Uint8Array, Uint16Array, Uint32Array, Float32Array, Dan Float64Array adalah semua contoh tipe array yang diketik. Setiap klasifikasi berhubungan dengan jenis informasi berpasangan tertentu dan memiliki ukuran byte yang sesuai.
Berikut adalah contoh cara menggunakan a Float32Array.
const myArray = baruFloat32Array([1.0, 2.0, 3.0, 4.0]);
menghibur.log (MyArray); // Keluaran: Float32Array [1, 2, 3, 4]
Contoh ini menciptakan yang baru Float32Array dengan empat elemen diatur ke 1.0, 2.0, 3.0, dan 4.0.
Array yang diketik sangat membantu saat bekerja dengan kumpulan data besar atau melakukan perhitungan matematis. Mereka bisa jauh lebih cepat daripada array standar karena memungkinkan Anda memanipulasi memori secara langsung.
Dengan mempermudah bekerja dengan data biner dan melakukan perhitungan matematis, menggunakan larik yang diketik dapat membantu mengoptimalkan kode JavaScript Anda.
4. Minimalkan Iterasi
Itu umum untuk menggunakan loop JavaScript untuk mengulangi array. Bagaimanapun, iterasi pada array besar bisa menjadi hambatan kinerja. Kurangi berapa kali Anda mengulangi array JavaScript untuk mengoptimalkannya.
Salah satu cara untuk melakukannya adalah dengan menggunakan Saring, peta, Dan mengurangi bukannya loop tradisional. Strategi-strategi ini meningkatkan eksekusi kode dan seringkali lebih cepat daripada iterasi manual pada sebuah array.
Anda dapat menggunakan metode peta dengan cara berikut:
const Array asli = [1, 2, 3, 4, 5];
// Kalikan setiap elemen dengan 2
const newArray = originalArray.peta((elemen) => elemen * 2)
Dalam hal ini, kode membuat array baru yang disebut newArray menggunakan metode peta. Metode peta menerapkan fungsi untuk setiap komponen originalArray dan mengembalikan hasilnya dalam array baru.
5. Gunakan Sintaks Penghancuran
Fitur penghancuran JavaScript adalah fitur canggih dalam JavaScript yang memungkinkan Anda mengekstrak nilai dari larik dan objek. Metode ini membuat kode lebih efisien dengan melakukan penugasan variabel yang lebih sedikit dan akses array yang lebih sedikit. Keuntungan menggunakan destrukturisasi meluas ke keterbacaan dan mengurangi upaya penulisan.
Ilustrasi cara mengekstraksi nilai dari array menggunakan destrukturisasi adalah sebagai berikut:
const susunanku = [1, 2, 3, 4, 5];
// Hancurkan elemen pertama dan ketiga
const [pertama,, ketiga] = myArray;
menghibur.log (pertama); // Keluaran: 1
menghibur.log (ketiga); // Keluaran: 3
Contoh ini menggunakan destrukturisasi untuk mengekstrak elemen pertama dan ketiga myArray. Ini memberikan nilai elemen pertama dari array ke Pertama variabel, dan nilai elemen ketiga ke ketiga variabel. Dengan meninggalkan ruang kosong dalam pola penghancuran, ia melewatkan elemen kedua.
Anda juga dapat menggunakan destrukturisasi dengan argumen fungsi untuk mengekstrak nilai dari array:
fungsimyFunction([pertama kedua]) {
menghibur.log (pertama);
menghibur.log (kedua);
}
const susunanku = [1, 2, 3, 4, 5];
myFunction (MyArray); // Keluaran: 1\n2
Contoh ini mendefinisikan fungsi yang disebut myFunction yang mengambil array sebagai parameter. Kemudian menggunakan destrukturisasi untuk mencatat elemen pertama dan kedua dari array ke konsol.
Optimalkan Array JavaScript untuk Aplikasi yang Lebih Cepat
Merampingkan array JavaScript sangat penting untuk meningkatkan kinerja kode Anda. Anda dapat secara signifikan meningkatkan daya tanggap dan kecepatan aplikasi Anda dengan melakukannya.
Untuk mendapatkan hasil maksimal dari array Anda, ingatlah untuk menggunakan operator spread, hindari operator hapus, gunakan array yang diketik, kurangi jumlah iterasi, dan gunakan destrukturisasi. Selain itu, cobalah mengukur kinerja kode Anda dan lakukan peningkatan mendasar untuk memastikan aplikasi Anda berjalan dengan lancar.
Anda dapat membuat aplikasi yang lebih cepat, lebih dapat diandalkan, dan memberikan pengalaman pengguna yang lebih baik dengan mengoptimalkan array Anda.