JavaScript - Penyahuraian Array: Membuka Kecermatan Array

Hai sana, para ahli JavaScript masa depan! Hari ini, kita akan mengembara ke dunia Penyahuraian Array. Jangan khawatir jika terdengar seperti suatu hal yang sulit - pada akhir pelajaran ini, Anda akan menyahurai array seperti seorang ahli! Jadi, pegang keyboard Anda (tongkat tak tampak), dan mari kita masuk ke dalam!

JavaScript - Array Destructuring

Apa Itu Penyahuraian Array?

Imaginilah Anda memiliki sebuah kotak hadiah yang cantik (itu adalah array kita) yang penuh dengan berbagai macam hadiah kecil (elemen array kita). Penyahuraian array adalah seperti membuka kotak itu secara ajaib dan menata semua hadiah kecil itu di atas meja, masing-masing di tempatnya sendiri. Itu adalah cara untuk menguraikan nilai dari array ke variabel yang berbeda. Keren, kan?

Mari kita mulai dengan contoh sederhana:

const buah = ['apple', 'banana', 'cherry'];
const [buahPertama, buahKedua, buahKetiga] = buah;

console.log(buahPertama);  // Output: 'apple'
console.log(buahKedua);    // Output: 'banana'
console.log(buahKetiga);   // Output: 'cherry'

Dalam contoh ini, kita mengambil array buah dan menguraikan nilainya ke tiga variabel terpisah. Itu seperti mengatakan, "Hai JavaScript, ambil buah ini dan berikan saya buah pertama, buah kedua, dan buah ketiga secara terpisah!"

Melompatkan Elemen Array Saat Penyahuraian Array

Sekarang, apa bila Anda sedang diet dan ingin melompatkan banana? Tidak masalah! Penyahuraian array memungkinkan Anda melompatkan elemen yang Anda tidak inginkan. Berikut adalah cara nya:

const [buahPertama, , buahKetiga] = ['apple', 'banana', 'cherry'];

console.log(buahPertama);  // Output: 'apple'
console.log(buahKetiga);   // Output: 'cherry'

Lihat koma ekstra antara buahPertama dan buahKetiga? Itu adalah kita mengatakan ke JavaScript, "Lompatkan item kedua, silakan!" Itu seperti memilih buah yang Anda inginkan dari mangkuk buah.

Penyahuraian Array dan Operator Sisa

Tunggu, masih ada lagi! Apa bila Anda ingin buah pertama, tapi kemudian ingin meletakkan yang lain di wadah lain? Itu adalah saat operator sisa (...) berguna:

const buah = ['apple', 'banana', 'cherry', 'date', 'elderberry'];
const [buahPertama, ...sisaBuah] = buah;

console.log(buahPertama);     // Output: 'apple'
console.log(sisaBuah);        // Output: ['banana', 'cherry', 'date', 'elderberry']

Di sini, buahPertama mendapat 'apple', dan sisaBuah mendapat yang lain. Itu seperti mengatakan, "Berikan saya buah pertama, lalu geser yang lain ke wadah ini!"

Penyahuraian Array dan Nilai Default

kadang-kadang, kotak buah kita mungkin tidak memiliki semua buah yang kita harapkan. Dalam kasus itu, kita dapat menentukan nilai default:

const [apple = 'apple merah', banana = 'banana kuning'] = ['apple hijau'];

console.log(apple);   // Output: 'apple hijau'
console.log(banana);  // Output: 'banana kuning'

Dalam contoh ini, kita mengatakan, "Jika tidak ada apple, gunakan 'apple merah', dan jika tidak ada banana, gunakan 'banana kuning'." Tetapi karena kita memiliki 'apple hijau', itu adalah apa yang kita dapatkan untuk apple, sedangkan banana menggunakan nilai default.

Tukar Variabel Menggunakan Penyahuraian Array

Ini adalah trik yang menarik: kita dapat menggunakan penyahuraian array untuk menukar variabel tanpa memerlukan variabel sementara. Itu seperti suatu trik magik!

let a = 'pertama';
let b = 'kedua';

[a, b] = [b, a];

console.log(a);  // Output: 'kedua'
console.log(b);  // Output: 'pertama'

Tada! Kita telah menukar nilai a dan b dalam satu baris. Itu seperti mereka langsung menukar tempat!

Penyahuraian Array Yang Dikembalikan Dari Fungsi

Terakhir tapi bukan terkecil, kita dapat menggunakan penyahuraian pada array yang dikembalikan dari fungsi. Misalnya, kita memiliki fungsi yang mengembalikan array data cuaca:

function dapatCuaca() {
return ['cerah', 25, '10%'];
}

const [langit, suhu, kelembapan] = dapatCuaca();

console.log(langit);          // Output: 'cerah'
console.log(suhu);           // Output: 25
console.log(kelembapan);     // Output: '10%'

Di sini, kita menangkap array yang dikembalikan dan langsung menguraikannya ke variabel terpisah. Itu seperti fungsi melempar sebuah paket, dan kita menguraikannya di udara!

Ringkasan Metode Penyahuraian Array

Berikut adalah tabel yang praktis untuk menyummarisakan metode yang kita pelajari:

Metode Deskripsi Contoh
Penyahuraian Dasar Menguraikan elemen array ke variabel const [a, b, c] = [1, 2, 3]
Melompatkan Elemen Melompatkan elemen yang tidak diinginkan saat penyahuraian const [a, , c] = [1, 2, 3]
Operator Sisa Mengumpulkan elemen sisanya ke dalam array const [a, ...rest] = [1, 2, 3, 4]
Nilai Default Menentukan nilai default untuk elemen yang hilang const [a = 1, b = 2] = [3]
Tukar Variabel Menukar nilai variabel [a, b] = [b, a]
Penyahuraian Return Fungsi Menguraikan array yang dikembalikan dari fungsi const [a, b] = getArray()

Dan itu adalah, teman-teman! Anda telah belajar seni penyahuraian array di JavaScript. Ingat, latihan membuat sempurna, jadi jangan khawatir untuk bermain dengan konsep ini. Sebelum Anda tahu, Anda akan menyahurai array dalam tidur Anda! Siapa sangka bahwa menguraikan array bisa begitu menyenangkan? Sekarang, maju dan menyahurai dengan kepercayaan! Selamat coding, dan semoga array Anda selalu terurai dengan rapi!

Credits: Image by storyset