Skip to main content

Looping

Untuk mengeksekusi perintah yang sama beberapa kali, diperlukan membuat/menulis perintah tersebut sebanyak yang diinginkan. Contoh seperti dibawah:

void main() {
print('Halo, Selamat datang');
print('Halo, Selamat datang');
print('Halo, Selamat datang');
print('Halo, Selamat datang');
print('Halo, Selamat datang');
print('Halo, Selamat datang');
print('Halo, Selamat datang');
}

Namun kode diatas tidak efisien, apalagi jika ingin menampilkan ratusan, ribuan dan selanjutnya. Looping dibuat untuk hal seperti ini. Dengan looping, kita buat 1 intruksi/statement kemudian kita set jumlah pengulangannya. Untuk membuat looping ada beberapa cara.

1. For

Alur yang terjadi pada for:

Check kondisi, Jika kondisi true, jalankan semua yang ada dalam block {} for, kemudian Kembali ke Check kondisi Jika kondisi false, berhenti

Contoh:

void main() {
for (int index=0; index <= 9; index++) {
print('$index. Halo, Selamat datang');
}
}

penjelasan block kondisi: (initial, check, increment/decrement)

  • initial : nilai awal untuk posisi looping / iterasi ke-n.
  • check : pengecekan kondisi. Jika kita ingin melakukan looping sebanyak 10 kali, maka bisa dibuat kondisi index <= 9. Kondisi ini dibuat dengan memperhatikan initial dan increment/decrement.
  • increment/decrement : digunakan untuk merubah nilai index setiap kali kondisi bernilai true. Increment berarti perubahan nilai index naik, decrement sebaliknya. Perubahan 1 ke 1, atau 2 tingkat, atau lainnya tergantung kita menggunakan operatornya.

Hasil output kode diatas:

alt

Selengkapnya bisa check ke official documentation: Loops | Dart

2. For In

Alur yang terjadi pada for in:

Ambil element ke-n, Lakukan perintah yang ada pada block for in.

Sehingga secara default, tidak ada batas berapa kali pengulangan dilakukan. Namun melakukan pengulangan sebanyak data yang dimiliki. Diperlukan data collection untuk melakukan for in.

Contoh:

void main() {
List menu = ['Burger','Kebab','Nasgor','Martabak Telor'];
for (String element in menu){
print(element);
}
}

Output:

alt

Selengkapnya bisa check ke official documentation: Loops | Dart

Untuk custom jumlah pengulangan berdasarkan kondisi tertentu bisa menggunakan break dan continue Loops | Dart

3. For Each

Sama seperti for in. Namun beda syntax dan lebih disarankan menggunakan for in dibanding foreach.

Example:

void main() {
List menu = ['Burger','Kebab','Nasgor','Martabak Telor'];
menu.forEach((element){
print(element);
});
}

Output:

alt

Selengkapnya bisa check ke official documentation: forEach method - Iterable class - dart:core library - Dart API

4. While

Alurnya sama seperti for. Namun beda syntax. Pada saat pertama kali pengecekan, ternyata kondisinya false langsung di stop. Sehingga tidak akan tampil apa-apa di console.

Example:

void main() {
int index = 1;
while(index<=3){
print('Lup yu');
index++;
}
}

Output:

alt

Selengkapnya bisa check ke official documentation: Loops | Dart

5. Do-While

Mirip dengan while namun alur terbalik. Di While, check terlebih dahulu kemudian eksekusi block nya. Sedangkan di Do-While, eksekusi dulu block kemudian check. Pada saat pertama kali pengecekan, ternyata kondisinya false langsung maka akan dieksukusi block dulu baru di stop. Sehingga akan tampil minimal 1 iterasi/perulangan.

Example:

void main() {
int index = 1;
do {
print('Lup yu');
index++;
}while(index<=3);

print('---------------');

int i = 1;
do {
print('Lup yu');
i++;
}while(i<1);//false
}

Output:

alt

Selengkapnya bisa check ke official documentation: Loops | Dart

6. Implement to Flutter

Saatnya implementasi ke Flutter dengan menggunakan beberapa fungsi baru sebagai pendukung implementasi ke flutter. Namun alur proses sampai tampil UI ini menggunakan konsep looping. Untuk implementasi ke flutter, tidak semua cara bisa ditempel.

Column(
children: [
const Text('------------------'),
for (int index = 1; index < 5; index++)
Text('Ini ada pada Index $index'),
const Text('------------------'),
],
),

alt

List<String> animals = [
'Cochroaces',
'Simba',
'Pikachu',
'Salmon',
'Turbo'
];

Column(
children: [
const Text('------------------'),
for (String animal in animals) Text(animal),
const Text('------------------'),
],
),

alt

Dan berikut beberapa cara pengaksesan, modifikasi, dan generate dari data list yang langsung dilakukan di flutter code ui. Ada yang langsung di property children/list dan ada pula menggunakan bantuan cascade operator.

List<String> animals = [
'Cochroaces',
'Simba',
'Pikachu',
'Salmon',
'Turbo'
];

Column(
children: [
const Text('------------------'),
...List.generate(animals.length, (index) {
return Text(animals[index]);
}),
const Text('------------------'),
],
),

Column(
children: List.generate(animals.length, (index) {
return Text(
'${index + 1}. ${animals[index]}',
);
}),
),

alt

Dengan List.generate kita bisa custom set jumlah data dan mendapatkan parameter index, jadi tidak perlu custom buat index sendiri. Fungsi index juga untuk mendapatkan value/element dari list tersebut.

List<String> animals = [
'Cochroaces',
'Simba',
'Pikachu',
'Salmon',
'Turbo'
];

Column(
children: [
const Text('------------------'),
...animals.map((e) => Text(e)).toList(),
const Text('------------------'),
],
),

Column(
children: animals.map((e) {
return Text(e);
}).toList(),
),

alt

Dengan menggunakan .map() dan toList() kitab isa mengakses seluruh data kemudian memodifikasi tipenya nya. Alurnya, setiap kali pada iterasi ke-n kita ambil nilai element(e) kemudian kita masukkan ke Widget Text dan di return, selannjutnya masuk ke toList() (list baru). Yang awalnya List<String> menjadi List<Text>.