Belajar Dasar JavaScript: Perulangan

Perulangan pada pemrograman berguna untuk membuat sebuah kode dijalankan berulang-ulang berdasarkan kondisi tertentu.

Perulangan for

Berdasarkan namanya, Perulangan For dibuat dengan keyword for. Berikut adalah contoh perulangan For:

for (let angka = 1; angka <= 10; angka++) {
  console.log(angka);
}

Sebarnya apa maksud kode di atas?.

Pertama mari kita mengenal struktur perulangan For.

  • let angka = 1 disebut sebagai inisialiasi.
  • angka <= 10 disebut sebagai kondisi.
  • angka++ disebut sebagai ekspresi final.
  • Kode di dalam kurung kurawal ({}) disebut sebagai blok kode dan kadang disebut sebagai statemen.

Pertama, inisialisasi akan di jalankan.

Kemudian kondisi di cek. Karena angka = 1, maka kondisi terpenuhi. Karena kondisi terpenuhi maka blok kode dijalankan. Setelah itu ekspresi final di jalankan dan menjadikan angka = 2.

Kemudian kondisi di cek lagi. Karena angka = 2, maka kondisi terpenuhi sehingga blok kode di jalankan. Setelah itu ekspresi final di jalankan dan menjadikan angka = 3.

Kemudian kondisi di cek lagi. Karena angka = 3, maka kondisi terpenuhi sehingga blok kode di jalankan. Setelah itu ekspresi final di jalankan dan menjadikan angka = 4.

Proses seperti tadi akan dilakukan terus menerus sampai angka = 11. Karena kondisi tidak terpenuhi maka blok kode tidak akan dijalankan dan perulangan telah selesai.

Keluaran dari kode di atas adalah:

1
2
3
4
5
6
7
8
9
10

Perulangan while

Sesuai dengan namanya, perulangan ini dideklarasikan dengan keyword while. Contohnya adalah seperti berikut:

let angka = 1;
while (angka <= 10) {
  console.log(angka);
  angka++;
}

Bagaimana kode tersebut akan di jalankan?. Struktur dari perulangan while seperti berikut:

  • angka <= 10 disebut sebagai kondisi.
  • Kode dalam kurung kurawal ({}) disebut sebagai blok kode atau statemen.

Pertama kondisi akan di cek, karena angka = 1 maka kondisi terpenuhi. Karena kondisi terpenuhi blok kode di jalankan dan menjadikan angka = 2.

Setelah itu kondisi di cek lagi, karena angka = 2 makan kondisi terpenuhi. Karena kondisi terpenuhi maka blok kode di jalankan dan menjadikan angka = 3.

Setelah itu kondisi di cek lagi, karena angka = 3 makan kondisi terpenuhi. Karena kondisi terpenuhi maka blok kode di jalankan dan menjadikan angka = 4.

Proses tadi diulang terus menerus sampai angka = 11, karena kondisi tidak terpenuhi blok kode tidak dijalankan dan perulangan telah selesai.

Keluaran dari kode di atas adalah:

1
2
3
4
5
6
7
8
9
10

Perulangan Do-While

Perulangan Do-While dideklarasikan dengan keyword do dan while sesuai dengan namanya. Contohnya seperti berikut:

let angka = 1;
do {
  console.log(angka);
  angka++;
} while (angka <= 10);

Perulangan ini mirip dengan perulangan Do. Strukturnya bisa dianalogikan dengan struktur pada perulangan Do. Namun ada perbedaan sedikit pada saat perulangan ini di jalankan.

Pertama, blok kode akan dijalankan terlebih dahulu dan menjadikan angka = 2.

Kemudian kondisi akan di cek. karena angka = 2 maka kondisi terpenuhi sehingga blok kode dijalankan dan menjadikan angka = 3.

Kemudian kondisi akan di cek lagi. karena angka = 3 maka kondisi terpenuhi sehingga blok kode dijalankan dan menjadikan angka = 4.

Proses tadi diulang-ulang sampai angka = 11, karena kondisi tidak terpenuhi maka blok kode tidak dijalankan dan perulangan berakhir.

Keluaran dari kode di atas adalah:

1
2
3
4
5
6
7
8
9
10

Perbedaan Perulangan While dan Do While

Sebenarnya apa perbedaan perulangan While dan Do While?

Dalam perulangan While, kondisi di cek dulu sebelum blok kode di jalankan. Pada perulangan Do While, blok kode di jalankan sebelum kondisi di cek. Jadi pada perulangan Do While, blok kode di jalankan minimal satu kali. Sedangkan pada perulangan While, blok kode bisa tidak di jalankan sama sekali.

Untuk mempermudah membedakannya berikut adalah 2 contoh di mana perbedaan keduanya terlihat dengan jelas.

Contoh While:

let angka = 11;
while (angka <= 10) {
  console.log(angka);
  angka++;
}

Kode di atas tidak menghasilkan keluaran apapun.

Contoh Do-While:

let angka = 11;
do {
  console.log(angka);
  angka++;
} while (angka <= 10);

// Keluaran:
// 11

Keluaran kode kode sangat berbeda padahal kondisi, blok kode serta keadaan awal kedua perulangan di atas sama.

continue

Continue merupakan perintah yang bisa di jalankan di perulangan. Continue akan langsung menjalankan perulangan selanjutnya. Contohnya seperti ini:

for (let angka = 1; angka <= 10; angka++) {
  if (angka == 5) {
    console.log("Angka 5 ditemukan.");
    continue;
  }
  console.log(angka);
}

Saat blok kode di jalankan dan angka = 5, maka perintah continue akan di jalankan. Continue akan meloncati semua kode setelahnya kemudian perulangan selanjutnya langsung di jalankan. Sehingga saat angka = 5, console.log(angka) tidak di jalankan.

Keluaran dari kode di atas adalah:

1
2
3
4
Angka 5 ditemukan.
6
7
8
9
10

break

Break merupakan merupakan perintah lainnya yang bisa di jalankan di perulangan selain continue. Break akan langsung menghentikan perulangan. Contohnya seperti berikut:

for (let angka = 1; angka <= 10; angka++) {
  if (angka == 5) {
    console.log("Angka 5 ditemukan. Perulangan dihentikan");
    break;
  }
  console.log(angka);
}

Saat angka = 5, maka perintah break akan di jalankan. Semua kode setelah break akan di loncati dan perulangan langsung berakhir. Jadi saat angka = 5, console.log(angka) tidak di jalankan dan perulangan akan langsung berakhir.

Keluaran dari kode di atas adalah:

1
2
3
4
Angka 5 ditemukan. Perulangan dihentikan