Apa yang dimaksud dengan looping di javascript?

Looping atau perulangan merupakan kode yang dieksekusi secara berulang oleh komputer selama memenuhi suatu kondisi yang disyaratkan.

Mengapa harus ada looping?

Misalkan kita diharuskan membuat program untuk mencetak kata ‘Terimakasih, Tuhan!’ sebanyak 5 kali. Maka kita masih bisa menggunakan sintak berikut:

Tapi bagaimana jika kita harus mencetak 1000 baris ‘Terimakasih, Tuhan!’ ?

Tentu tanpa adanya konsep perulangan, kode kita akan sangat tidak efektif. Kalau kata programmer sih, tidak DRY (Don’t Repeat Yourself).

Contoh diatas merupakan contoh naif nya sih. Beberapa kasus lain yang menggunakan looping adalah mengecek tiap komponen dari banyak komponen, mencetak suatu pola tertentu secara dinamis, dll.

Apa komponen utama looping?

1. Start => Kondisi yang harus terpenuhi agar looping ‘mulai’ berjalan
2. Stop => Kondisi yang harus terpenuhi agar looping ‘berhenti’ berjalan. Tanpa adanya komponen stop, maka looping akan terus berjalan tanpa batas. Kondisi ini disebut dengan infinite loop. Kondisi ini harus dihindari karena akan membuat program yang kita buat menjadi eror.
3. Proses => baris kode yang akan dijalankan selama proses perulangan.

Bagaimana cara penulisan code (sintaks) looping di Java Script?

Ada berbagai sintak looping, kita bisa menggunakan salah satu yang sekiranya cocok.

While

Cara membaca kode tersebut dengan bahasa manusia adalah:

1. Hai Komputer, aku perkenalkan variabel (var) i yang bernilai 1
2. Selama i bernilai kurang dari 6, maka eksekusi baris yang diapit kurung kurawal ya.. ({}). Jika i bernilai tidak kurang dari 6, maka berhenti saja.
3. Cetak ‘Terimakasih, Tuhan!’
4. Tambah nilai i
5. Kembali ke langkah 2

Catatan:

i merupakan variabel yang umum digunakan para programmer saat looping. Boleh-boleh saja jika kalian menggunakan bentuk yang lain. i++ artinya i ditambah 1. Boleh juga diganti i += 1 atau i = i + 1. Penambahan i ini akan menyebabkan nilai i selalu berubah setiap loop, sehingga suatu saat, nilai i tidak akan memenuhi kondisi i < 6 dan mengalami tahap stop. Tanpa sintak i++ maka nilai i akan selalu tetap sehingga kondisi i < 6 tidak akan pernah tercapai. Kondisi seperti itu menyebabkan infinite loop.

Do While

Cara membaca kode tersebut dengan bahasa manusia adalah:

1. Hai Komputer, aku perkenalkan variabel (var) i yang bernilai 1
2. Cetak ‘Terimakasih, Tuhan!’
3. Tambah nilai i
4. Selama i bernilai kurang dari 6, maka eksekusi baris yang diapit kurung kurawal ya.. ({}). Jika i bernilai tidak kurang dari 6, maka berhenti saja.
5. Kembali ke langkah 2

For

Cara membaca kode tersebut dengan bahasa manusia adalah:

1. Untuk variabel i yang bernilai awal 1, jika nilai i kurang dari 6, maka eksekusi kode berikut dan jangan lupa tambah nilai i dengan 1. Selain itu, maka berhenti saja.
2. Cetak ‘Terimakasih, Tuhan!’ dan kembali ke baris 1.

Kapan menggunakan while dan kapan menggunakan for?

Secara umum, tergantung nyamannya kita saja mau pakai yang mana. Tetapi berdasarkan pengalaman, jika temen-temen menemukan kondisi dimana belum tau pasti kapan kondisi stop, maka disarankan menggunakan while. Sebaliknya, jika kondisi stop sudah pasti, maka disarankan menngunakan for.

Nah, cukup mudah kan? Jika masih kesulitan, coba baca dan pahami dari awal lagi (looping hahaha) sampai temen-temen paham ya (stop).

Sebenarnya, masih ada sintaks looping for in dan for of . Tapi lebih banyak digunakan ketika sudah belajar array dan objek. Jadi sementara, banyak berlatih menggunakan for dan while dulu saja ya...

Contoh di bawah ini memperlihatkan baris coding yang serupa tapi ditulis berulang-ulang dalam beberapa baris.

text += cars[0] + "<br>";
text += cars[1] + "<br>";
text += cars[2] + "<br>";
text += cars[3] + "<br>";
text += cars[4] + "<br>";
text += cars[5] + "<br>";

Contoh di atas dapat disederhanakan dengan membuat pengulangan seperti pada contoh di bawah ini.

var i;
for (i = 0; i < cars.length; i++) {
  text += cars[i] + "<br>";
}

Referensi Perulangan JavaScript

Penulisan For Loop

Format penulisan for loop seperti di bawah ini.

for (statement 1; statement 2; statement 3) {
  // code block to be executed
}

Statement 1 (perintah 1) dieksekusi sekali pada saat loop dimulai. Statemen 2 (perintah 2) memeriksa kondisi yang menentukan apakah loop dilanjutkan atau dihentikan. Statemen 3 (perintah 3) dieksekusi pada setiap loop. Di dalam for loop terdapat kumpulan perintah (code block) yang akan dieksekusi berulang-ulang oleh loop.

for (i = 0; i < 5; i++) {
  text += "The number is " + i + "<br>";
}

Perhatikan contoh di atas. Perintah 1 (i = 0) memberikan nilai 0 kepada variable i, hanya dieksekusi sekali pada saat loop dimulai. Perintah 2 (i < 5) memeriksa nilai i, apabila i lebih kecil dari 5 maka loop dilanjutkan, apabila i lebih besar atau sama dengan 5 maka loop dihentikan. Perintah 3 (i++) dieksekusi setiap kali loop dieksekusi.

Perintah 1

Perintah 1 normalnya digunakan untuk inisialisasi variable yang diperlukan pada loop. Pada perintah 1 kita dapat inisialisasi banyak variable sekaligus dipisahkan dengan koma.

for (i = 0, len = cars.length, text = ""; i < len; i++) {
  text += cars[i] + "<br>";
}

Perintah 1 tidak wajib, sifatnya opsional dan dapat dihilangkan.

var i = 2;
var len = cars.length;
var text = "";
for (; i < len; i++) {
  text += cars[i] + "<br>";
}

Perintah 2

Perintah 2 memeriksa kondisi untuk menentukan apakah loop dilanjutkan atau tidak. Apabila perintah 2 menghasilkan nilai boolean true maka loop dilanjutkan. Apabila perintah 2 menghasilkan nilai boolean false maka loop dihentikan. Perintah 2 sifatnya opsional dan bisa dihilangkan. Apabila perintah 2 tidak diberikan maka loop akan dieksekusi selamanya.

Perintah 3

Perintah 3 normalnya digunakan untuk melakukan operasi penambahan atau pengurangan pada suatu variable. Perintah 3 juga bisa dihilangkan (sifatnya opsional) apabila proses penambahan atau pengurangan tersebut dilakukan di dalam loop.

var i = 0;
var len = cars.length;
for (; i < len; ) {
  text += cars[i] + "<br>";
  i++;
}

For in loop

For in loop adalah pengulangan for khusus untuk object. Pengulangan akan dieksekusi untuk setiap properti yang ada dalam object tersebut.

var person = {fname:"John", lname:"Doe", age:25};

var text = "";
var x;
for (x in person) {
  text += person[x];
}

For of loop

For of loop adalah pengulangan for khusus untuk array. Pengulangan akan dieksekusi untuk setiap elemen dalam array.

var cars = ["BMW", "Volvo", "Mini"];
var x;

for (x of cars) {
  document.write(x + "<br >");
}

For of loop juga dapat dipakai pada string. Pengulangan akan dieksekusi untuk setiap karakter dalam string tersebut.

Apa yang dimaksud looping dalam javascript?

Apakah yang dimaksud looping dalam pemrograman?

Apa fungsi dari loop?

While loop untuk apa?