Mesin Pekerja Keras: Loops (Pengulangan)
Kekuatan utama sebuah komputer bukanlah kecerdasannya, melainkan kemampuannya melakukan pekerjaan
berulang-ulang tanpa pernah merasa lelah atau bosan.
Jika kamu diminta mencetak angka 1 sampai 10.000 ke layar, menulis `console.log()` sebanyak sepuluh ribu
kali secara manual adalah sebuah kegilaan. Mari serahkan siksaan itu kepada fitur bahasa pemrograman yang
disebut Loops (Pengulangan / Perulangan).
🔄 1. Pekerja Pabrik Tradisional (`for` loop)
Ini adalah gaya pengulangan klasik yang ada di hampir semua bahasa pemrograman. `for` Loop ibarat sebuah mesin presisi; kamu memberitahukan titik mulai (Start), titik berhenti (Kondisi), dan langkah majunya (Step).
let i = 1
i <= 5
i++
for (let i = 1; i <= 5; i++) {
console.log("Angka ke-" + i);
}
// --- HASIL DI CONSOLE ---
// Angka ke-1
// Angka ke-2
// Angka ke-3
// Angka ke-4
// Angka ke-5
Penting: i++ adalah cara singkat khas
programmer untuk mengatakan i = i + 1. Ia menambahkan
dirinya sendiri dengan 1 angka setiap putarannya selesai.
⏳ 2. Mengulang Tak Tentu Arah (`while` loop)
Kadang kita tidak tahu pasti berapa kali kita harus mengulang. Bayangkan contoh nyata dalam Game: "Selama nyawa pemain (HP) masih di atas nol, game harus terus berjalan!". Di saat inilah `while` masuk sebagai pahlawan.
let hpPemain = 100;
// Selama HP lebih dari 0, jalankan block ini!
while (hpPemain > 0) {
console.log("Pemain menyerang! HP tersisa: " + hpPemain);
// Pemain diserang balik, nyawa berkurang 20 secara perlahan
hpPemain = hpPemain - 20;
}
console.log("GAME OVER!");
Awas Infinite Loop
Jika kamu lupa menulis kode untuk mengurangi `hpPemain`, maka nyawanya akan selalu
100 secara abadi.
Browser-mu akan memproses jutaan baris tulisan "Pemain menyerang!" setiap detik tiada henti hingga
laptopmu meledak / nge-*freeze* (Crash). Inilah yang disebut mimpi buruk Infinite Loop
(Pengulangan Tanpa Ujung).
🚀 3. Ekstrak Pengulangan Modern (`forEach` / `map`)
Mayoritas tugas Frontend Developer sesungguhnya bukanlah menghitung angka matematika, melainkan
mengeluarkan ratusan daftar data dari Server (Array JSON) untuk digambar ke HTML secara anggun.
Pada kode di atas,
Menulis `for (i=0; i
Membongkar Array Keranjang Belanja
// Anggap ini data dari Server Tokopedia
const daftarBelanja = ["Kabel C", "Cas 20W", "Softcase"];
// ❌ Kuno & Rentan Salah (Mesti hafal rumus i, Length, dsb):
for (let i = 0; i < daftarBelanja.length; i++) {
console.log( daftarBelanja[i] );
}
// ✅ Sangat Elegan, Modern, Singkat (forEach):
daftarBelanja.forEach( (barang) => {
console.log(`Kita akan membeli: ${barang}`);
});
forEach adalah fungsi peluru ajaib bawaan JS. Ia akan
otomatis mengulang sendiri dan memasukkan setiap potongan data dari dalam
Keranjang langsung ke wadah yang kita sebut barang
secara bergiliran tanpa pusing memikirkan titik awal maupun akhir!