Perulangan dalam Javascript

3:15 PM
Perulangan digunakan untuk mengulangi satu atau sekumpulan statement saat suatu syarat terpenuhi. Saat syarat tidak terpenuhi, perulangan akan menghentikan tugasnya. Untuk lebih memahami tentang perulangan kita akan mempelajari penggunaan dua operator yang sering digunakan dalam perulangan yaitu, increment(++) dan (--). Berikut ini kesamaan antara kedua operator tersebut dengan operator penjumlahan dan operator pengurangan biasa.
  1. i++ sama dengan i+=1 atau i=i+1
  2. i-- sama dengan i-=1 atau i=i-1
Semoga saja kalian paham, karena kita akan melanjutkan pembahasan kita tentang perulangan yang bisa menggunakan operator tersebut atau operator lainnya.

Perulangan dengan for dan while
Perulangan hampir sama dengan percabangan, kita butuh kondisi yang akan digunakan sebagai syarat berlangsungnya perulangan. Kondisi tersebut bisa berupa nilai boolean atau perbandingan nilai dari dua variabel. Dalam perulangan, nilai dari suatu variabel yang dijadikan bagian dari kondisi perlu diubah terus menerus agar nilai tersebut bisa sesuai kondisi setelah perulangan dilakukan beberapa kali. Jika nilai variabel tidak pernah berubah dan kondisi tidak terpenuhi, maka perulangan mungkin saja terulang tanpa henti. Untuk lebih jelasnya, perhatikan contoh di bawah ini!
<HTML>
<HEAD>
    <TITLE>Belajar HTML</TITLE>
</HEAD>
<BODY>
   <Script>
      var i=0;
      while(i <= 5){
            document.write("i = "+ i + "<BR / >");
            i++;
      }
    </Script>
</BODY>
</HTML>

 Perulangan dalam script yang ada di atas menggunakan while. Perulangan dengan while akan mengeksekusi statement yang diapit dengan tanda "{" dan "}". Setiap pernyataan diulang, nilai variabel i berubah sehingga nilai yang ditampilkan dengan document.write berubah. Saat syarat tidak terpenuhi atau bernilai false, maka perulangan akan dihentikan. Selain menggunakan while, kita bisa juga menggunakan for yang merupakan versi singkat dari while. 
<HTML>
<HEAD>
    <TITLE>Belajar HTML</TITLE>
</HEAD>
<BODY>
   <Script>
     for(var i=0; i <= 5; i++)document.write("i = "+ i + "<BR / >");
    </Script>
</BODY>
</HTML>
Contoh di atas hasilnya sama dengan contoh sebelumnya. Pada perulangan dengan for, di dalam kurung terdapat nilai awal variabel, syarat dan perubahan nilai dari variabel yang sama. Pada contoh di atas, variabel yang digunakan adalah i dengan nilai awal "i=0".

Bandingkan dengan script pada kode HTML di bawah ini!
<HTML>
<HEAD>
    <TITLE>Belajar HTML</TITLE>
</HEAD>
<BODY>
   <Script>
     for(var i=5; i >= 0; i--)document.write("i = "+ i + "<BR / >");
   </Script>
</BODY>
</HTML>

Break dan Continue

Dalam perulangan, ada break dan continue yang bisa digunakan untuk melewati bagian dari perulangan. Break akan menghentikan perulangan, sedangkan continue akan melanjutkan perulangan dengan mengabaikan baris atau statement setelahnya. Penggunaan break dan continue dan break dalam perulangan umumnya diikuti dengan if-else.

Perhatikan contoh berikut ini!
<HTML>
<HEAD>
    <TITLE>Belajar HTML</TITLE>
</HEAD>
<BODY>
   <Script>
      var i=0;
      while(i <= 5){
            document.write("i = "+ i + "<BR / >");
            i++; 
            if(i==4)continue; 
            document.write("============= <BR />"); 
      }
    </Script>
</BODY>
</HTML>

Pada contoh di atas, pada saat i bernilai 4 ada bagian dari perulangan yang dilewati sehingga di bawah "i=3" tidak ada "=============". Bandingkan dengan contoh berikut ini!

<HTML>
<HEAD>
    <TITLE>Belajar HTML</TITLE>
</HEAD>
<BODY>
   <Script>
      var i=0;

      while(i <= 5){
            if(i==4){
                  document.write("5 tidak ditampilkan karena ada break"); 
                  break;
            }
            document.write("i = "+ i + "<BR / >"); 
            i++;
      }

    </Script>
</BODY>
</HTML>


 Pada contoh di atas, setelah i bernilai 4, perulangan dihentikan sehingga "i=5" tidak ditampilkan dan saat i sama dengan 4 yang dicetak adalah "5 tidak ditampilkan karena ada break". Dalam perulangan, kita bisa menggunakan operator apapun. Yang penting, nilai variabel yang digunakan harus berubah sampai syarat tidak terpenuhi. Jika nilai variabel tidak diubah, maka perulangan akan dieksekusi tanpa henti.
<HTML>
<HEAD>
    <TITLE>Belajar HTML</TITLE>
</HEAD>
<BODY>
   <Script>
      var i=0;
      while(i <= 100){
            document.write("i = "+ i + "<BR / >");
            i*=10;
      }
    </Script>
</BODY>
</HTML>
Eh, ada yang salah ketik, maaf, kalau perulangannya jadi tak terhenti karena nilai selalu sama dengan 0.
<HTML>
<HEAD>
    <TITLE>Belajar HTML</TITLE>
</HEAD>
<BODY>
   <Script>
      var i=1;
      while(i <= 100){
            document.write("i = "+ i + "<BR / >");
            i*=10;
      }
    </Script>
</BODY>
</HTML>

Perulangan dengan do-while

Satu yang terakhir adalah perulangan do(...)while yang hampir sama dengan while. Bedanya, dalam do while, perulangan minimal akan dijalankan sebanyak satu kali karena statement-statement dalam perulangan dieksekusi sebelum pengecekkan kondisi.
<HTML>
<HEAD>
    <TITLE>Belajar HTML</TITLE>
</HEAD>
<BODY>
   <Script>
      var i=100;
      do{
            document.write("i = "+ i + "<BR / >");
            i*=10;
      }while(i < 100);
    </Script>
</BODY>
</HTML>
Coba bandingkan dengan perulangan menggunakan while dan syarat yang sama.
<HTML>
<HEAD>
    <TITLE>Belajar HTML</TITLE>
</HEAD>
<BODY>
   <Script>
      var i=100;
      while(i < 100){
            document.write("i = "+ i + "<BR / >");
            i*=10;
      }

    </Script>
</BODY>
</HTML>
Contoh di atas seharusnya tidak menampilkan apa-apa karena sejak awal, syarat dari perulangan sudah tidak terpenuhi.

Selain for seperti yang sudah saya contohkan, ada juga for-in. Singkatnya, berikut ini adalah nama-nama perulangan yang bisa digunakan dalam javascript!
  1. for
  2. for in
  3. while
  4. do-while
Selamat belajar dan mencoba!

Subscribe to: Post Comments (Atom)