Perulangan pada Javascript

 Perulangan

    Perulangan adalah konsep penting dalam pemrograman yang memungkinkan kita menjalankan serangkaian tindakan atau blok kode berulang kali. Dengan perulangan, Anda bisa mengeksekusi blok kode secara berulang berdasarkan kondisi tertentu atau jumlah iterasi yang ditentukan. Ini sangat bermanfaat ketika Anda perlu melakukan operasi yang sama berulang kali, seperti memproses setiap elemen dalam sebuah array, mengulangi tindakan berdasarkan jumlah tertentu, atau menjalankan tugas-tugas berulang dalam program Anda.

Setiap program pasti membutuhkan perulangan. Oleh karena itu, dalam pembelajaran bahasa pemrograman apa pun, selalu ada materi atau kelas yang membahas perulangan. Di dalam JavaScript, perulangan dilakukan menggunakan kata kunci for dan while.

Perulangan for adalah salah satu jenis loop yang paling umum digunakan dalam JavaScript untuk menjalankan blok kode sejumlah kali yang ditentukan. Berikut adalah sintaks dasar dari perulangan for:

for (inisialisasi; kondisi; increment/decrement) {
  // kode yang akan dijalankan setiap iterasi
}

1. Perulangan for

Komponen-komponen dalam Sintaks for

1. Inisialisasi: Biasanya digunakan untuk mendeklarasikan dan menginisialisasi variabel loop. Ini dieksekusi hanya sekali di awal loop.

   let i = 0;
   
   

2. Kondisi: Ekspresi yang dievaluasi sebelum setiap iterasi. Jika kondisi ini bernilai true, blok kode di dalam loop dijalankan. Jika false, loop berhenti.

   i < 10;
   
   

3. Increment/Decrement: Ekspresi yang dieksekusi setelah setiap iterasi. Biasanya digunakan untuk memperbarui variabel loop.

   i++;
   
   

Contoh dan Penjelasan

Contoh dengan Penghitungan Maju :

for (let i = 0; i < 10; i++) {
  console.log(i);
}

Penjelasan

1. Inisialisasi:

   let i = 0;
   
   

   Variabel i diinisialisasi dengan nilai 0.

2. Kondisi:

   i < 10;
   
   

   Loop akan terus berjalan selama i kurang dari 10.

3. Increment:

   i++;
   
   

   Setelah setiap iterasi, nilai i akan ditambah 1.

4. Blok Kode:

   console.log(i);
   
   

   Nilai i dicetak ke console pada setiap iterasi.

Apa yang Terjadi di Setiap Iterasi

• Iterasi pertama: i = 0
  • Kondisi 0 < 10 adalah true.
  • Output: 0
  • i menjadi 1.
• Iterasi kedua: i = 1
  • Kondisi 1 < 10 adalah true.
  • Output: 1
  • i menjadi 2.
• Iterasi ketiga: i = 2
  • Kondisi 2 < 10 adalah true.
  • Output: 2
  • i menjadi 3.
• dan seterusnya hingga i = 9.
• Iterasi kesepuluh: i = 9
  • Kondisi 9 < 10 adalah true.
  • Output: 9
  • i menjadi 10.
• Iterasi kesebelas: i = 10
  • Kondisi 10 < 10 adalah false.
  • Loop berhenti.

Hasil Akhir yang Dicetak ke Console

0
1
2
3
4
5
6
7
8
9

Contoh dengan Penghitungan Mundur

for (let i = 10; i > 0; i--) {
  console.log(i);
}

Penjelasan

1. Inisialisasi:

   let i = 10;
   
   

   Variabel i diinisialisasi dengan nilai 10.

2. Kondisi:

   i > 0;
   
   

   Loop akan terus berjalan selama i lebih besar dari 0.

3. Decrement:

   i--;
   
   

   Setelah setiap iterasi, nilai i akan dikurangi 1.

4. Blok Kode:

   console.log(i);
   
   

   Nilai i dicetak ke console pada setiap iterasi.

Apa yang Terjadi di Setiap Iterasi

• Iterasi pertama: i = 10
  • Kondisi 10 > 0 adalah true.
  • Output: 10
  • i menjadi 9.
• Iterasi kedua: i = 9
  • Kondisi 9 > 0 adalah true.
  • Output: 9
  • i menjadi 8.
• Iterasi ketiga: i = 8
  • Kondisi 8 > 0 adalah true.
  • Output: 8
  • i menjadi 7.
• dan seterusnya hingga i = 1.
• Iterasi kesepuluh: i = 1
  • Kondisi 1 > 0 adalah true.
  • Output: 1
  • i menjadi 0.
• Iterasi kesebelas: i = 0
  • Kondisi 0 > 0 adalah false.
  • Loop berhenti.

Hasil Akhir yang Dicetak ke Console

10
9
8
7
6
5
4
3
2
1

Dengan menggunakan perulangan for, Anda bisa mengontrol berapa kali blok kode dijalankan dengan sangat presisi. Ini sangat berguna untuk berbagai tugas pemrograman, seperti iterasi melalui elemen-elemen array, melakukan perhitungan, dan lain-lain.

Dalam JavaScript, perulangan for memiliki beberapa variasi yang dapat digunakan tergantung pada kebutuhan Anda. Berikut adalah berbagai jenis perulangan for yang tersedia:

1. Perulangan for Biasa

Perulangan for ini adalah yang paling umum digunakan untuk mengulang blok kode sejumlah kali yang ditentukan.

Sintaks

for (inisialisasi; kondisi; increment/decrement) {
  // kode yang akan dijalankan setiap iterasi
}

Contoh

for (let i = 0; i < 5; i++) {
  console.log(i);
}

2. Perulangan for...in

Perulangan for...in digunakan untuk mengiterasi properti enumerable dari sebuah objek. Ini berguna untuk mengakses kunci dari sebuah objek.

Sintaks:

for (variabel in objek) {
  // kode yang akan dijalankan untuk setiap properti
}

Contoh:

const obj = {a: 1, b: 2, c: 3};

for (let key in obj) {
  console.log(key + ": " + obj[key]);
}

3. Perulangan for...of

Perulangan for...of digunakan untuk mengiterasi objek iterable (seperti array, string, Map, Set, dll). Ini berguna untuk mengakses nilai dari objek iterable.

Sintaks:

for (variabel of iterable) {
  // kode yang akan dijalankan untuk setiap nilai
}

Contoh:

const array = [1, 2, 3, 4, 5];

for (let value of array) {
  console.log(value);
}

4. Perulangan for Bersarang (Nested For Loop)

Anda dapat menggunakan perulangan for di dalam perulangan for lainnya untuk mengulang blok kode dalam bentuk dua dimensi atau lebih.

Sintaks:

for (let i = 0; i < n; i++) {
  for (let j = 0; j < m; j++) {
    // kode yang akan dijalankan setiap iterasi
  }
}

Contoh:

for (let i = 0; i < 3; i++) {
  for (let j = 0; j < 3; j++) {
    console.log(`i: ${i}, j: ${j}`);
  }
}

5. Perulangan for dengan Array Method

Selain perulangan for tradisional, JavaScript juga menyediakan metode array seperti forEach, map, filter, dan reduce yang bisa digunakan untuk iterasi melalui elemen array.

forEach

Digunakan untuk mengeksekusi fungsi sekali untuk setiap elemen dalam array.

const array = [1, 2, 3, 4, 5];

array.forEach(value => {
  console.log(value);
});

map

Digunakan untuk membuat array baru dengan hasil pemanggilan fungsi untuk setiap elemen dalam array.

const array = [1, 2, 3, 4, 5];
const newArray = array.map(value => value * 2);
console.log(newArray); // Output: [2, 4, 6, 8, 10]

filter

Digunakan untuk membuat array baru dengan semua elemen yang lulus tes yang diberikan oleh fungsi.

const array = [1, 2, 3, 4, 5];
const filteredArray = array.filter(value => value > 2);
console.log(filteredArray); // Output: [3, 4, 5]

reduce

Digunakan untuk menerapkan fungsi pada setiap elemen array (dari kiri ke kanan) sehingga array tersebut menjadi satu nilai tunggal.

const array = [1, 2, 3, 4, 5];
const sum = array.reduce((total, value) => total + value, 0);
console.log(sum); // Output: 15

2. Perulangan While

Perulangan while dalam JavaScript adalah cara untuk mengulang blok kode selama kondisi yang diberikan bernilai true. Berikut adalah penjelasan mendetail mengenai perulangan while, termasuk sintaks dan contoh penggunaannya:

Sintaks while

while (kondisi) {
  // kode yang akan dijalankan selama kondisi bernilai true
}

Penjelasan Komponen

1. Kondisi: Ekspresi yang dievaluasi sebelum setiap iterasi. Jika hasilnya true, blok kode di dalam loop while akan dijalankan. Jika false, loop akan berhenti.
2. Blok Kode: Kode di dalam kurung kurawal {} yang akan dieksekusi berulang kali selama kondisi bernilai true.

Contoh Penggunaan while

Contoh 1: Penghitung Sederhana

let i = 0;

while (i < 5) {
  console.log(i);
  i++;
}

Penjelasan:

• Inisialisasi Variabel: let i = 0; - variabel i diinisialisasi dengan nilai 0.
• Kondisi: i < 5 - loop akan berjalan selama i kurang dari 5.
• Blok Kode:
  • console.log(i); - mencetak nilai i ke console.
  • i++; - meningkatkan nilai i sebesar 1 setiap iterasi.

Output:

0
1
2
3
4

Contoh 2: Mengumpulkan Data dari Pengguna

let sum = 0;
let number = 0;

do {
  number = parseInt(prompt("Masukkan angka (0 untuk berhenti): "), 10);
  sum += number;
} while (number !== 0);

console.log("Jumlah total: " + sum);

Penjelasan:

• Inisialisasi Variabel:
  • let sum = 0; - variabel sum diinisialisasi dengan nilai 0.
  • let number = 0; - variabel number diinisialisasi dengan nilai 0.
• Loop do...while: Loop ini memastikan bahwa blok kode dieksekusi setidaknya sekali sebelum kondisi diuji.
  • number = parseInt(prompt("Masukkan angka (0 untuk berhenti): "), 10); - mengambil input dari pengguna dan mengubahnya menjadi integer.
  • sum += number; - menambahkan nilai number ke sum.
• Kondisi: number !== 0 - loop akan terus berjalan selama number tidak sama dengan 0.

Contoh 3: Perulangan dengan Kondisi Kompleks

let i = 10;

while (i > 0) {
  if (i % 2 === 0) {
    console.log(i + " adalah angka genap");
  }
  i--;
}

Penjelasan:

• Inisialisasi Variabel: let i = 10; - variabel i diinisialisasi dengan nilai 10.
• Kondisi: i > 0 - loop akan berjalan selama i lebih besar dari 0.
• Blok Kode:
  • if (i % 2 === 0) - memeriksa apakah i adalah angka genap.
  • console.log(i + " adalah angka genap"); - mencetak pesan jika i adalah angka genap.
  • i--; - mengurangi nilai i sebesar 1 setiap iterasi.

Output:

10 adalah angka genap
8 adalah angka genap
6 adalah angka genap
4 adalah angka genap
2 adalah angka genap

Infinite Loop

Perlu diperhatikan bahwa perulangan while bisa menyebabkan loop tak berujung (infinite loop) jika kondisi tidak pernah menjadi false. Contoh di bawah ini akan menyebabkan loop tak berujung:

let i = 0;

while (true) {
  console.log(i);
  i++;
}

Kesimpulan

Perulangan while sangat fleksibel dan dapat digunakan dalam berbagai situasi di mana Anda ingin menjalankan blok kode selama kondisi tertentu bernilai true. Berikut adalah beberapa poin penting yang perlu diingat:

• Pastikan kondisi dalam while akan menjadi false pada suatu titik untuk menghindari infinite loop.
• Gunakan pernyataan break untuk keluar dari loop jika diperlukan berdasarkan kondisi tertentu.
• do...while adalah variasi dari while yang memastikan blok kode dijalankan setidaknya sekali sebelum kondisi diuji.