7.2 KiB
Dasar-Dasar JavaScript: Array dan Loop
Sketchnote oleh Tomomi Imura
Kuis Pra-Pelajaran
Pelajaran ini mencakup dasar-dasar JavaScript, bahasa yang memberikan interaktivitas pada web. Dalam pelajaran ini, Anda akan mempelajari tentang array dan loop, yang digunakan untuk memanipulasi data.
🎥 Klik gambar di atas untuk video tentang array dan loop.
Anda dapat mengikuti pelajaran ini di Microsoft Learn!
Array
Bekerja dengan data adalah tugas umum dalam bahasa pemrograman, dan tugas ini menjadi lebih mudah ketika data diorganisasi dalam format struktural seperti array. Dengan array, data disimpan dalam struktur yang mirip dengan daftar. Salah satu keuntungan utama array adalah Anda dapat menyimpan berbagai jenis data dalam satu array.
✅ Array ada di sekitar kita! Bisakah Anda memikirkan contoh nyata dari array, seperti susunan panel surya?
Sintaks untuk array adalah sepasang tanda kurung siku.
let myArray = [];
Ini adalah array kosong, tetapi array dapat dideklarasikan dengan data yang sudah terisi. Nilai-nilai dalam array dipisahkan oleh koma.
let iceCreamFlavors = ["Chocolate", "Strawberry", "Vanilla", "Pistachio", "Rocky Road"];
Nilai-nilai dalam array diberi nilai unik yang disebut index, yaitu angka bulat yang ditentukan berdasarkan jaraknya dari awal array. Dalam contoh di atas, nilai string "Chocolate" memiliki indeks 0, dan indeks "Rocky Road" adalah 4. Gunakan indeks dengan tanda kurung siku untuk mengambil, mengubah, atau menyisipkan nilai dalam array.
✅ Apakah Anda terkejut bahwa array dimulai dari indeks nol? Dalam beberapa bahasa pemrograman, indeks dimulai dari 1. Ada sejarah menarik tentang ini, yang dapat Anda baca di Wikipedia.
let iceCreamFlavors = ["Chocolate", "Strawberry", "Vanilla", "Pistachio", "Rocky Road"];
iceCreamFlavors[2]; //"Vanilla"
Anda dapat memanfaatkan indeks untuk mengubah nilai, seperti ini:
iceCreamFlavors[4] = "Butter Pecan"; //Changed "Rocky Road" to "Butter Pecan"
Dan Anda dapat menyisipkan nilai baru pada indeks tertentu seperti ini:
iceCreamFlavors[5] = "Cookie Dough"; //Added "Cookie Dough"
✅ Cara yang lebih umum untuk menambahkan nilai ke array adalah dengan menggunakan operator array seperti array.push()
Untuk mengetahui berapa banyak item yang ada dalam array, gunakan properti length
.
let iceCreamFlavors = ["Chocolate", "Strawberry", "Vanilla", "Pistachio", "Rocky Road"];
iceCreamFlavors.length; //5
✅ Cobalah sendiri! Gunakan konsol browser Anda untuk membuat dan memanipulasi array buatan Anda sendiri.
Loop
Loop memungkinkan kita melakukan tugas berulang atau iteratif, dan dapat menghemat banyak waktu dan kode. Setiap iterasi dapat bervariasi dalam variabel, nilai, dan kondisinya. Ada berbagai jenis loop dalam JavaScript, dan semuanya memiliki perbedaan kecil, tetapi pada dasarnya melakukan hal yang sama: mengulang data.
For Loop
for
loop membutuhkan 3 bagian untuk iterasi:
counter
Variabel yang biasanya diinisialisasi dengan angka yang menghitung jumlah iterasicondition
Ekspresi yang menggunakan operator perbandingan untuk menghentikan loop ketika bernilaifalse
iteration-expression
Dijalankan di akhir setiap iterasi, biasanya digunakan untuk mengubah nilai counter
// Counting up to 10
for (let i = 0; i < 10; i++) {
console.log(i);
}
✅ Jalankan kode ini di konsol browser. Apa yang terjadi ketika Anda membuat perubahan kecil pada counter, condition, atau iteration expression? Bisakah Anda membuatnya berjalan mundur, menciptakan hitungan mundur?
While Loop
Berbeda dengan sintaks for
loop, while
loop hanya membutuhkan kondisi yang akan menghentikan loop ketika kondisinya menjadi false
. Kondisi dalam loop biasanya bergantung pada nilai lain seperti counter, dan harus dikelola selama loop berlangsung. Nilai awal untuk counter harus dibuat di luar loop, dan ekspresi apa pun untuk memenuhi kondisi, termasuk mengubah counter, harus dikelola di dalam loop.
//Counting up to 10
let i = 0;
while (i < 10) {
console.log(i);
i++;
}
✅ Mengapa Anda memilih for loop dibandingkan dengan while loop? 17 ribu pembaca memiliki pertanyaan yang sama di StackOverflow, dan beberapa pendapat mungkin menarik bagi Anda.
Loop dan Array
Array sering digunakan dengan loop karena sebagian besar kondisi membutuhkan panjang array untuk menghentikan loop, dan indeks juga dapat menjadi nilai counter.
let iceCreamFlavors = ["Chocolate", "Strawberry", "Vanilla", "Pistachio", "Rocky Road"];
for (let i = 0; i < iceCreamFlavors.length; i++) {
console.log(iceCreamFlavors[i]);
} //Ends when all flavors are printed
✅ Bereksperimenlah dengan mengulang array buatan Anda sendiri di konsol browser.
🚀 Tantangan
Ada cara lain untuk mengulang array selain menggunakan for dan while loop. Ada forEach, for-of, dan map. Tulis ulang loop array Anda menggunakan salah satu teknik ini.
Kuis Pasca-Pelajaran
Tinjauan & Belajar Mandiri
Array dalam JavaScript memiliki banyak metode yang sangat berguna untuk manipulasi data. Baca lebih lanjut tentang metode ini dan coba beberapa di antaranya (seperti push, pop, slice, dan splice) pada array buatan Anda sendiri.
Tugas
Penafian:
Dokumen ini telah diterjemahkan menggunakan layanan terjemahan AI Co-op Translator. Meskipun kami berupaya untuk memberikan hasil yang akurat, harap diperhatikan bahwa terjemahan otomatis mungkin mengandung kesalahan atau ketidakakuratan. Dokumen asli dalam bahasa aslinya harus dianggap sebagai sumber yang berwenang. Untuk informasi yang bersifat kritis, disarankan menggunakan jasa penerjemah manusia profesional. Kami tidak bertanggung jawab atas kesalahpahaman atau penafsiran yang keliru yang timbul dari penggunaan terjemahan ini.