JavaScript Jadi Rajin: Ngulang Tugas Pake for dan while Loop!

Udah bisa nyuruh JavaScript bikin keputusan pake if/else? Keren! Sekarang, gimana kalau kita punya tugas yang mau dilakuin berulang-kali? Misalnya, mau nampilin semua nama siswa dari daftar, atau mau ngitung mundur dari 10 ke 1. Masa iya kita nulis console.log() atau perintah lain sebanyak itu manual? Gak efisien banget!

Nah, di sinilah Perulangan (Looping) di JavaScript beraksi! Loop ngebolehin kita buat ngejalanin satu blok kode secara berulang selama kondisi tertentu masih terpenuhi. Ini bikin kode jadi jauh lebih ringkes, gampang di-manage, dan pastinya lebih hemat tenaga ngetik.

Ada beberapa jenis loop utama di JavaScript, tapi yang paling sering dipake buat pemula adalah for loop dan while loop.

1. for Loop: Si Jagoan Pengulangan Terstruktur

for loop ini cocok banget dipake kalau kamu udah tau berapa kali persisnya kamu mau ngulang satu blok kode, atau kalau kamu mau ngulang berdasarkan urutan angka tertentu.

• Sintaks Dasar for Loop:

  for (inisialisasi; kondisi; iterasi) {
      // Blok kode yang mau diulang
  }

  Mari kita bedah tiga bagian penting di dalem kurung () itu:
  1. inisialisasi: Pernyataan ini dijalanin sekali aja sebelum loop dimulai. Biasanya dipake buat ngedeklarasiin dan ngasih nilai awal ke variabel counter (penghitung). Contoh: let i = 0;
  2. kondisi: Ekspresi boolean ini bakal dicek sebelum tiap iterasi (pengulangan) dimulai. Selama kondisinya true, blok kode di dalem loop bakal dijalanin. Kalau kondisinya false, loop berhenti. Contoh: i < 5;
  3. iterasi (atau increment/decrement): Pernyataan ini dijalanin setelah tiap iterasi selesai. Biasanya dipake buat ngubah nilai variabel counter (misal, nambahin 1). Contoh: i++; (tambah i dengan 1) atau i--; (kurangin i dengan 1).

Contoh Penggunaan for Loop:

// Nampilin angka 0 sampe 4
for (let i = 0; i < 5; i++) {
    console.log("Iterasi ke-" + i);
}
/* Output:
Iterasi ke-0
Iterasi ke-1
Iterasi ke-2
Iterasi ke-3
Iterasi ke-4
*/
 
// Ngitung mundur dari 3 ke 1
for (let hitung = 3; hitung >= 1; hitung--) {
    console.log(hitung + "...");
}
console.log("Mulai!");
/* Output:
3...
2...
1...
Mulai!
*/
 
// Nampilin semua elemen di array
let namaBuah = ["Apel", "Jeruk", "Mangga"];
for (let i = 0; i < namaBuah.length; i++) { // Looping sebanyak jumlah elemen array
    console.log("Saya suka buah " + namaBuah[i]);
}
/* Output:
Saya suka buah Apel
Saya suka buah Jeruk
Saya suka buah Mangga
*/

for loop ini super serbaguna buat ngulang tugas yang jumlah iterasinya udah bisa ditentuin.

2. while Loop: Ngulang Selama Kondisinya Masih Oke

while loop ini lebih simpel sintaksnya. Dia bakal terus ngulang satu blok kode selama kondisi yang ditentuin itu true.

• Sintaks Dasar while Loop:

  while (kondisi) {
      // Blok kode yang mau diulang
      // PENTING: Harus ada sesuatu di dalem sini yang akhirnya bikin 'kondisi' jadi false,
      // kalau gak, bisa jadi infinite loop (loop tak berujung)!
  }

  • kondisi: Ekspresi boolean yang dicek sebelum tiap iterasi. Kalau true, blok kode jalan. Kalau false, loop berhenti.

Contoh Penggunaan while Loop:

let angka = 0;
while (angka < 3) {
    console.log("Angka sekarang: " + angka);
    angka++; // PENTING! Naikin nilai angka biar gak infinite loop
}
/* Output:
Angka sekarang: 0
Angka sekarang: 1
Angka sekarang: 2
*/
 
let tebakanBenar = false;
let jumlahTebakan = 0;
while (!tebakanBenar) { // Selama tebakanBenar itu false (pake operator NOT !)
    jumlahTebakan++;
    let tebakanUser = Math.floor(Math.random() * 5) + 1; // Angka acak 1-5
    console.log("Tebakan ke-" + jumlahTebakan + ": " + tebakanUser);
    if (tebakanUser === 3) { // Anggap angka 3 yang bener
        tebakanBenar = true; // Ubah kondisi biar loop berhenti
        console.log("Hore! Angka 3 ditebak!");
    }
    if (jumlahTebakan >= 10) { // Batasan biar gak kelamaan
        console.log("Gagal menebak setelah 10 kali.");
        break; // Keluar paksa dari loop (dibahas di bawah)
    }
}

Hati-hati sama Infinite Loop! Kalau pake while loop, pastiin kondisi di dalem () itu akhirnya bisa jadi false. Kalau enggak, programmu bakal nge-loop terus-terusan tanpa henti (infinite loop), yang bisa bikin browser nge-hang! Biasanya, kamu perlu ngubah nilai variabel yang dipake di kondisi itu di dalem blok loop-nya (kayak angka++ di contoh pertama).

3. do...while Loop: Lakuin Dulu, Baru Cek Kondisi

do...while loop ini mirip sama while loop, tapi ada satu beda penting: blok kodenya dijalanin minimal sekali, baru setelah itu kondisinya dicek. Kalau while loop ngecek kondisi dulu baru jalanin kode, do...while sebaliknya.

• Sintaks Dasar do...while Loop:

  do {
      // Blok kode yang mau diulang (dijalanin minimal sekali)
  } while (kondisi);

  • Kondisi dicek setelah blok kode dijalanin. Selama kondisi true, loop lanjut.

Contoh Penggunaan do...while Loop:

let inputPengguna;
do {
    // Minta input ke pengguna sampe dia ngetik 'selesai'
    // Fungsi prompt() ini cuma jalan di browser, gak di Node.js
    // inputPengguna = prompt("Ketik 'selesai' untuk keluar:"); 
    // console.log("Kamu mengetik: " + inputPengguna);
 
    // Kita simulasi aja inputnya di sini
    inputPengguna = (Math.random() < 0.8) ? "coba lagi" : "selesai"; // 80% coba lagi, 20% selesai
    console.log("Simulasi input: " + inputPengguna);
 
} while (inputPengguna !== "selesai");
 
console.log("Loop selesai!");

do...while ini berguna kalau kamu mau mastiin satu blok kode itu dijalanin minimal sekali, gak peduli kondisi awalnya apa.

Mengontrol Alur Loop: break dan continue

Kadang, kita butuh kontrol lebih dalem soal gimana loop berjalan. Ada dua keyword yang bisa bantu:

1. break:

   • Dipake buat ngentiin (keluar dari) loop secara paksa, meskipun kondisi loop-nya sebenernya masih true.
   • Pas break dijalanin, JavaScript langsung lompat ke baris kode setelah blok loop.
   • Kita udah liat contohnya di while loop tebakan angka tadi, buat ngentiin loop kalau udah nebak 10 kali.

   for (let i = 0; i < 10; i++) {
       if (i === 5) {
           console.log("Loop dihentikan di i = 5");
           break; // Keluar dari loop for ini
       }
       console.log("Nilai i adalah " + i);
   }
   // Outputnya bakal sampe "Nilai i adalah 4" terus "Loop dihentikan di i = 5"

2. continue:

   • Dipake buat ngeskip (melewatkan) sisa kode di iterasi saat ini, dan langsung lompat ke iterasi berikutnya dari loop.

   for (let i = 0; i < 5; i++) {
       if (i === 2) {
           console.log("Iterasi i = 2 dilewati (bagian bawahnya).");
           continue; // Langsung ke iterasi berikutnya (i jadi 3)
       }
       console.log("Ini adalah iterasi ke-" + i);
   }
   /* Output:
   Ini adalah iterasi ke-0
   Ini adalah iterasi ke-1
   Iterasi i = 2 dilewati (bagian bawahnya).
   Ini adalah iterasi ke-3
   Ini adalah iterasi ke-4
   */

break dan continue ini ngasih fleksibilitas lebih buat ngontrol alur perulanganmu.

Looping ini konsep yang super fundamental di hampir semua bahasa pemrograman. Dengan for, while, dan do...while, kamu bisa ngotomatisasi tugas-tugas yang berulang, ngolah data di array, dan bikin program yang jauh lebih efisien.

Pahami beda kapan pake for (kalau jumlah iterasi jelas) dan kapan pake while (kalau ngulang berdasarkan kondisi yang bisa berubah). Dan selalu hati-hati biar gak kejebak infinite loop!

Selanjutnya, kita bakal belajar cara bikin "paket" kode yang bisa dipake ulang: Fungsi!