JavaScript - For...of Loop

Selamat datang, para pemrogram yang sedang berkembang! Hari ini, kita akan mendalami salah satu fitur paling berguna di JavaScript: loop for...of. Sebagai guru ilmu komputer yang ramah di lingkungan sekitar Anda, saya sangat gembira untuk memandu Anda dalam perjalanan ini. Jadi, ambil minuman favorit Anda, betahlah, dan mari kita mulai petualangan coding ini bersama!

Apa Itu Loop for...of?

Sebelum kita melompat ke hal yang mendetail, mari kita mengerti apa yang dimaksud oleh loop for...of. Bayangkan Anda memiliki keranjang penuh buah berwarna-warni, dan Anda ingin memeriksa setiap buah satu per satu. Loop for...of adalah seperti asisten yang membantu Anda mengambil setiap buah dari keranjang dan memberikannya kepada Anda, satu per satu, sampai keranjang kosong.

Dalam istilah pemrograman, loop for...of memungkinkan kita untuk mengulang (istilah khusus untuk "melalui") objek yang dapat diulang seperti array, string, dan struktur data lainnya yang kita akan belajar tentang kemudian.

Sintaks

Sekarang, mari kita lihat bagaimana menulis loop for...of. Jangan khawatir jika awalnya terlihat agak aneh – kita akan membongkarnya bersama!

for (variable of iterable) {
// kode yang akan dieksekusi
}

Mari kitauraikan ini:

• for: Kata kunci ini memberitahu JavaScript bahwa kita sedang memulai sebuah loop.
• variable: Ini adalah tempat kita menyimpan setiap item saat kita mengulang melalui iterable.
• of: Kata kunci ini membuat ini menjadi loop for...of.
• iterable: Ini adalah objek yang kita ulang (seperti keranjang buah).
• Kode di dalam kurung kurawal {} adalah apa yang kita inginkan untuk dilakukan dengan setiap item.

Contoh

Contoh 1: Mengulang Melalui Array

Mari kita mulai dengan contoh sederhana. Kita akan membuat array buah dan mencetak setiap satunya.

let fruits = ['apple', 'banana', 'cherry', 'date'];

for (let fruit of fruits) {
console.log(fruit);
}

Jika Anda menjalankan kode ini, Anda akan melihat:

apple
banana
cherry
date

Apa yang terjadi di sini? Loop for...of mengambil setiap buah dari array fruits dan menyimpannya di variabel fruit. Kemudian, kita menggunakan console.log() untuk mencetak setiap buah.

Contoh 2: Mengulang Melalui String

Apakah Anda tahu bahwa string juga dapat diulang? Mari kita menuliskan sebuah kata:

let word = 'Hello';

for (let letter of word) {
console.log(letter);
}

Ini akan mengeluarkan:

H
e
l
l
o

Setiap karakter dalam string dianggap sebagai item individual yang dapat kita ulang. Keren, kan?

Contoh 3: Menggunakan for...of dengan Angka

Sekarang, mari kita lebih praktis. Bayangkan Anda adalah seorang guru (seperti saya!) dan Anda ingin menghitung skor rata-rata untuk kelas:

let scores = [85, 92, 78, 95, 88];
let total = 0;
let count = 0;

for (let score of scores) {
total += score;
count++;
}

let average = total / count;
console.log(`Rata-rata kelas adalah ${average}`);

Skrip ini akan menghitung dan mencetak skor rata-rata. Kita menggunakan loop for...of untuk menambahkan semua skor dan menghitung berapa banyak yang ada.

Contoh 4: Keluar dari Loop

kadang-kadang, Anda mungkin ingin menghentikan loop sebelum selesai. Kita dapat melakukan ini dengan kata kunci break. Mari kita katakan kita mencari buah tertentu:

let fruits = ['apple', 'banana', 'cherry', 'date'];
let searchFor = 'cherry';

for (let fruit of fruits) {
if (fruit === searchFor) {
console.log(`Menemukan ${searchFor}!`);
break;
}
console.log(`Memeriksa ${fruit}...`);
}

Skrip ini akan berhenti segera setelah menemukan 'cherry', tanpa memeriksa buah lainnya.

Contoh 5: Melewatkan Item dengan continue

Apa bila kita ingin melewatkan item tertentu? Kita dapat menggunakan kata kunci continue. Mari kita hanya mencetak buah yang dimulai dengan 'a':

let fruits = ['apple', 'banana', 'apricot', 'cherry', 'avocado'];

for (let fruit of fruits) {
if (!fruit.startsWith('a')) {
continue;
}
console.log(fruit);
}

Ini hanya akan mencetak 'apple', 'apricot', dan 'avocado'.

Tabel Metode

Berikut adalah tabel metode yang kita gunakan dalam contoh-contoh ini:

Metode	Deskripsi	Contoh
console.log()	Mencetak output ke konsol	console.log('Hello, World!')
startsWith()	Memeriksa apakah string dimulai dengan karakter yang ditentukan	'apple'.startsWith('a') // true
break	Menghentikan loop	if (condition) break;
continue	Melompat ke iterasi berikutnya dalam loop	if (condition) continue;

Kesimpulan

Dan begitu saja, teman-teman! Kita telah melakukan perjalanan melalui negeri for...of loops, dari array sederhana ke string, dan bahkan belajar untuk keluar atau melewatkan item. Ingat, latihan membuatah sempurna, jadi jangan takut untuk mencoba konsep ini.

Dalam tahun-tahun saya mengajar, saya menemukan bahwa cara terbaik untuk belajar adalah dengan melakukan. Jadi, ini adalah tugas kecil untuk Anda: Cobalah membuat loop for...of Anda sendiri dengan jenis data yang berbeda. Mungkin loop melalui film favorit Anda, atau nama teman-teman Anda. Kesempatan tak terbatas!

Happy coding, dan ingat – di dunia pemrograman, setiap loop adalah kesempatan untuk menemukan!

Credits: Image by storyset