Pelajari loop JavaScript lengkap seperti for, while, do while, break, continue, looping array, HTML, dan for...in object.
Loop JavaScript Lengkap untuk Pemula
Pembukaan
Loop JavaScript digunakan untuk menjalankan kode berulang kali secara otomatis. Loop sangat penting dalam pengembangan website modern karena mempermudah pengolahan data seperti monitoring CCTV, analytic camera system, dashboard server, dan jaringan realtime.
Dalam sistem profesional seperti Haikal IT Support, loop digunakan untuk:
Monitoring banyak CCTV
Menampilkan data server
Analytic camera report
Dashboard jaringan
Proses data otomatis
Berikut penjelasan lengkap loop JavaScript.
1. Perulangan for
Loop for digunakan jika jumlah perulangan diketahui.
Contoh Kode
for(let i = 1; i <= 5; i++) {
console.log("Monitoring CCTV " + i);
}
Hasil Demo
Monitoring CCTV 1
Monitoring CCTV 2
Monitoring CCTV 3
Monitoring CCTV 4
Monitoring CCTV 5
Penjelasan
Struktur for:
for(inisialisasi; kondisi; increment)
2. Perulangan Array
Loop sering digunakan untuk membaca array.
Contoh Kode
let perangkat = [
"CCTV",
"Server",
"Router"
];
for(let i = 0; i < perangkat.length; i++) {
console.log(perangkat[i]);
}
Hasil Demo
CCTV
Server
Router
Penjelasan
lengthmenghitung jumlah data array.
3. Perulangan melalui Header HTML
Loop dapat digunakan untuk membuat elemen HTML.
Contoh Kode
<!DOCTYPE html>
<html>
<body>
<div id="demo"></div>
<script>
let text = "";
for(let i = 1; i <= 3; i++) {
text += "<h2>CCTV " + i + "</h2>";
}
document.getElementById("demo").innerHTML = text;
</script>
</body>
</html>
Hasil Demo
CCTV 1
CCTV 2
CCTV 3
Penjelasan
Loop membuat banyak heading otomatis.
4. Perulangan while
while berjalan selama kondisi bernilai true.
Contoh Kode
let i = 1;
while(i <= 3) {
console.log("Server " + i);
i++;
}
Hasil Demo
Server 1
Server 2
Server 3
Penjelasan
Kondisi dicek sebelum loop berjalan.
5. Perulangan do while
do while menjalankan kode minimal satu kali.
Contoh Kode
let i = 1;
do {
console.log("Network " + i);
i++;
}
while(i <= 3);
Hasil Demo
Network 1
Network 2
Network 3
Penjelasan
Kode dijalankan dulu.
Lalu kondisi dicek.
6. Pemutusan Perulangan (break)
break digunakan untuk menghentikan loop.
Contoh Kode
for(let i = 1; i <= 5; i++) {
if(i === 3) {
break;
}
console.log(i);
}
Hasil Demo
1
2
Penjelasan
Loop berhenti saat
i === 3.
7. Pecah dan Lanjutkan Perulangan (continue)
continue melewati satu iterasi.
Contoh Kode
for(let i = 1; i <= 5; i++) {
if(i === 3) {
continue;
}
console.log(i);
}
Hasil Demo
1
2
4
5
Penjelasan
Angka
3dilewati.
8. Gunakan for...in untuk Object
for...in digunakan untuk mengulang property object.
Contoh Kode
let server = {
nama: "Server CCTV",
status: "Online",
ip: "192.168.1.1"
};
for(let data in server) {
console.log(data + " : " + server[data]);
}
Hasil Demo
nama : Server CCTV
status : Online
ip : 192.168.1.1
Penjelasan
for...inmembaca semua property object.
Struktur Dasar Loop for
Contoh Kode
for(let i = 0; i < 5; i++) {
// kode
}
Struktur Dasar while
Contoh Kode
while(kondisi) {
// kode
}
Struktur Dasar do while
Contoh Kode
do {
// kode
}
while(kondisi);
Penyebab Error Loop JavaScript
Beberapa kesalahan umum:
Infinite loop
Salah kondisi
Lupa increment
Salah penggunaan break
Cara Mengatasi Error Loop
1. Pastikan Ada Increment
Salah:
while(i < 5) {
console.log(i);
}
Penjelasan
Loop tidak berhenti.
Benar:
while(i < 5) {
console.log(i);
i++;
}
2. Gunakan break Jika Dibutuhkan
Contoh Kode
if(i === 10) {
break;
}
Contoh Kasus
Kasus:
Dashboard monitoring harus menampilkan semua CCTV aktif.
Contoh Kode
let camera = [
"CCTV 1",
"CCTV 2",
"CCTV 3"
];
for(let i = 0; i < camera.length; i++) {
console.log(camera[i]);
}
Hasil Demo
CCTV 1
CCTV 2
CCTV 3
Tips Tambahan
Gunakan
foruntuk jumlah pasti.Gunakan
whileuntuk kondisi dinamis.Gunakan
for...inuntuk object.Hindari infinite loop.
Internal Link
Artikel terkait di Haikal IT Support:
Array JavaScript
Iterasi Array JavaScript
Fungsi JavaScript
Persyaratan JavaScript
Dasar JavaScript
Kesimpulan
Loop JavaScript digunakan untuk menjalankan kode berulang secara otomatis. JavaScript menyediakan berbagai jenis loop seperti for, while, do while, dan for...in untuk mempermudah pengolahan data.
Pemahaman loop sangat penting dalam pengembangan dashboard monitoring CCTV, analytic camera system, server management, dan network system profesional di Haikal IT Support.
