Perulangan dalam JavaScript (for, while, do…while)

By | 16 October 2025

Setelah sebelumnya sudah mengenal apa itu JavaScript, variable, tipe data dan operator dalam JavaScript, sekarang kita akan belajar tentang perulangan dalam JavaScript. Adapun Perulangan (looping) dalam JavaScript digunakan untuk menjalankan perintah berulang kali secara otomatis, selama kondisi tertentu masih terpenuhi. Dengan perulangan, kamu tidak perlu menulis kode yang sama berulang-ulang.

Contoh sederhana: menampilkan angka 1 sampai 10. Tanpa perulangan, kamu harus menulis console.log(1);, console.log(2);, dan seterusnya. Dengan perulangan, cukup beberapa baris saja.

1. Perulangan for

for digunakan ketika kamu sudah tahu berapa kali perulangan akan dijalankan.

Struktur dasar:

for (inisialisasi; kondisi; perubahan) {
  // kode yang akan dijalankan
}

Contoh:

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

Penjelasan:

  • let i = 1 → nilai awal

  • i <= 5 → kondisi agar loop terus berjalan

  • i++ → menambah nilai i setiap kali perulangan

2. Perulangan while

while digunakan ketika kamu tidak tahu pasti berapa kali perulangan harus berjalan — asal kondisi masih benar, maka akan terus berulang.

Struktur dasar:

while (kondisi) {
  // kode yang akan dijalankan
}

Contoh:

let angka = 1;

while (angka <= 3) {
  console.log("Perulangan ke-" + angka);
  angka++;
}

Hasil:

Perulangan ke-1
Perulangan ke-2
Perulangan ke-3

Catatan: Pastikan kondisi diubah di dalam loop (angka++) agar tidak terjadi infinite loop (loop tak berujung).

3. Perulangan do...while

do...while hampir sama dengan while, tetapi minimal satu kali dijalankan meskipun kondisi salah.

Struktur dasar:

do {
  // kode dijalankan dulu
} while (kondisi);

Contoh:

let x = 6;

do {
  console.log("Nilai x = " + x);
  x++;
} while (x <= 5);

Hasil:

Nilai x = 6

Walau kondisi x <= 5 salah dari awal, kode tetap berjalan sekali sebelum berhenti.

Studi Kasus 1: Membuat Daftar Angka Otomatis

for (let i = 1; i <= 10; i++) {
  document.write(i + "<br>");
}

Hasil di browser:

1
2
3
4
5
6
7
8
9
10

Kode ini berguna saat kamu ingin menampilkan data berulang seperti nomor urut, daftar baris, atau item tabel.

Studi Kasus 2: Membuat Daftar Produk

Katakan kamu punya daftar produk di array, lalu ingin menampilkannya di halaman web:

let produk = ["Laptop", "Keyboard", "Mouse", "Monitor"];

for (let i = 0; i < produk.length; i++) {
  document.write((i + 1) + ". " + produk[i] + "<br>");
}

Hasil di browser:

1. Laptop
2. Keyboard
3. Mouse
4. Monitor

Dengan perulangan, kamu bisa menampilkan semua data tanpa menulis satu per satu, efisien dan mudah dirawat.

Kesimpulan

Perulangan adalah fitur penting dalam JavaScript yang memudahkan kamu mengulang tugas secara otomatis.
Gunakan:

  • for → ketika jumlah perulangan sudah diketahui,

  • while → ketika perulangan bergantung pada kondisi,

  • do...while → ketika kamu ingin kode dijalankan setidaknya satu kali.

Setelah memahami dasar ini, kamu siap melangkah ke topik berikutnya: Fungsi (Function) dalam JavaScript untuk membuat kode lebih modular dan efisien.