Belajar Perulangan For In JavaScript: Syntax, Cara, dan Contohnya

Perulangan for in di JavaScript mengiterasi properti dalam object. Ikuti tutorial mudah cara pakainya serta contoh sederhana!
RevoU Staff
December 13, 2023
5
min read

Mau Belajar

Software Engineering

?

Belajar di RevoU! Dapatkan skill digital paling in-demand langsung dari praktisi terbaik di bidangnya. Kelas online 100% LIVE, 1:1 career coaching, dan akses ke Community Hub dengan 6000+ member selamanya untuk support perkembangan karir kamu!
DAFTAR FULL PROGRAMCOBA COURSE GRATIS

Overview

Perulangan for in di JavaScript mengiterasi properti dalam object dan mengambil key dalam object tersebut yang nantinya dapat digunakan untuk memanipulasi data dalam object.

JavaScript memainkan peran penting dalam membuat website yang interaktif dan dinamis. Salah satu fitur yang sering digunakan oleh developer adalah perulangan for in

Perulangan for in di JavaScript berguna untuk mengiterasi properti dalam object, memungkinkan kita untuk mengambil kunci (key) dalam object tersebut yang nantinya dapat digunakan untuk memanipulasi data dalam object. Hal ini sangat penting, terutama saat bekerja dengan object yang memiliki banyak properti.

Jika kita membutuhkan nilai (value), maka sebaiknya menggunakan looping for biasa atau for of.

Manfaat Perulangan For In

Berikut beberapa manfaat menggunakan perulangan for in dalam konteks web development:

  • Efisiensi dalam mengelola object: for in sangat efektif untuk mengiterasi properti dalam object, yang merupakan struktur data umum dalam JavaScript. Proses ini memudahkan developer mengakses dan memanipulasi data object.
  • Kode lebih clean dan terorganisasi: menggunakan for in membantu mengurangi jumlah baris kode yang diperlukan untuk mengiterasi properti object. Dengan begitu, kode lebih clean dan mudah dibaca.
  • Fleksibilitas dalam penggunaan: for in juga bisa dipakai pada object dengan jumlah properti yang tidak diketahui atau berubah-ubah, membuatnya sangat fleksibel untuk berbagai kasus penggunaan.
  • Memudahkan debugging dan maintenance: dengan struktur yang jelas dan terorganisasi, for in memudahkan proses debugging dan pemeliharaan kode, terutama dalam proyek besar.
  • Penggunaan dalam DOM manipulation: for in berguna dalam manipulasi DOM, seperti saat mengiterasi object yang berisi referensi elemen DOM atau properti style.
  • Terintegrasi dengan fitur JavaScript lain: for in dapat dengan mudah dikombinasikan dengan fitur JavaScript lain seperti if conditional atau metode Array.prototype.forEach untuk kasus yang lebih kompleks. 

Syntax JavaScript For In

Syntax dasar dari for in dalam JavaScript adalah sebagai berikut:

  • Variable: variabel yang akan menerima key properti dari object pada setiap iterasi.
  • Object: object yang properti-propertinya akan diiterasi.

Cara Menggunakan JavaScript Perulangan For In dan Contohnya

Selanjutnya, mari kita lihat cara menggunakan penggunaan for in. Misalkan kita memiliki object yang menyimpan informasi tentang berbagai jenis buah dan stoknya di sebuah toko:

#1 Menampilkan informasi stok buah

Dalam contoh di atas, for in dipakai untuk mengiterasi melalui setiap properti dalam object stokBuah. Pada setiap iterasi, nama buah dan jumlah stoknya ditampilkan ke console. Hal ini sangat membantu, misalnya, untuk menampilkan informasi stok pada dashboard sebuah aplikasi manajemen toko.

#2 Menambahkan pajak pada setiap buah

Misalnya kita ingin menambahkan pajak sebesar 10% pada harga setiap buah. Kita bisa menggunakan for in untuk mengiterasi melalui object dan meng-update harganya.

Dalam contoh di atas, kita mengiterasi melalui object hargaBuah dan mengupdate harga setiap buah dengan menambahkan 10% pajak. Hasilnya kemudian di-print ke console.

FAQ (Frequently Asked Question)

Apakah perulangan for in dapat digunakan untuk mengiterasi elemen-elemen dalam array?

Meskipun secara teknis mungkin menggunakan for in untuk mengiterasi elemen dalam array, proses ini tidak disarankan.

For in dirancang untuk mengiterasi properti object, bukan elemen array. Menggunakannya pada array bisa menghasilkan output tidak terduga, terutama jika array tersebut telah dimodifikasi dengan properti tambahan. Untuk mengiterasi array, lebih baik menggunakan for, for of, atau metode array seperti forEach.

RevoU Staff
Kickstart your career in tech with RevoU!

Masih ragu? Coba dulu 3 hari, GRATIS
di Full-Stack Trial Class!

Rasakan pengalaman belajar di RevoU Full-Stack Program: Kelas 100% LIVE, Mini portofolio lewat hands-on assignment, Bimbingan Team Lead & small group discussion. Kalau cocok, kamu bisa lanjut daftar Full Program dengan kesempatan Fast-Track (skip semua tes seleksi masuk, langsung ke tahap akhir!)

Masih ragu? Coba dulu 3 hari, GRATIS
di Full-Stack Trial Class!

Rasakan pengalaman belajar di RevoU Full-Stack Program: Kelas 100% LIVE, Mini portofolio lewat hands-on assignment, Bimbingan Team Lead & small group discussion. Kalau cocok, kamu bisa lanjut daftar Full Program dengan kesempatan Fast-Track (skip semua tes seleksi masuk, langsung ke tahap akhir!)

Masih ragu? Coba dulu 3 hari, GRATIS
di Full-Stack Trial Class!

Rasakan pengalaman belajar di RevoU Full-Stack Program: Kelas 100% LIVE, Mini portofolio lewat hands-on assignment, Bimbingan Team Lead & small group discussion. Kalau cocok, kamu bisa lanjut daftar Full Program dengan kesempatan Fast-Track (skip semua tes seleksi masuk, langsung ke tahap akhir!)

Artikel Lainnya

Mau belajar

Software Engineering

?

Belajar di RevoU! Dapatkan skill digital paling in-demand langsung dari praktisi terbaik di bidangnya. Kelas online 100% LIVE, 1:1 career coaching, dan akses ke Community Hub dengan 6000+ member selamanya untuk support perkembangan karir kamu!
Daftar Isi

Mulai karirmu dalam

Software Engineering

Belajar di RevoU! Dapatkan skill digital paling in-demand langsung dari praktisi terbaik di bidangnya. Kelas online 100% LIVE, 1:1 career coaching, dan akses ke Community Hub dengan 6000+ member selamanya untuk support perkembangan karir kamu!

Mau Belajar

Software Engineering

?

Belajar di RevoU! Dapatkan skill digital paling in-demand langsung dari praktisi terbaik di bidangnya. Kelas online 100% LIVE, 1:1 career coaching, dan akses ke Community Hub dengan 6000+ member selamanya untuk support perkembangan karir kamu!

DAFTAR FULL PROGRAM

Mau Belajar

Software Engineering

?

Belajar Perulangan For In JavaScript: Syntax, Cara, dan Contohnya

Perulangan for in di JavaScript mengiterasi properti dalam object. Ikuti tutorial mudah cara pakainya serta contoh sederhana!
RevoU Staff
December 13, 2023
5
min read

Overview

Perulangan for in di JavaScript mengiterasi properti dalam object dan mengambil key dalam object tersebut yang nantinya dapat digunakan untuk memanipulasi data dalam object.

JavaScript memainkan peran penting dalam membuat website yang interaktif dan dinamis. Salah satu fitur yang sering digunakan oleh developer adalah perulangan for in

Perulangan for in di JavaScript berguna untuk mengiterasi properti dalam object, memungkinkan kita untuk mengambil kunci (key) dalam object tersebut yang nantinya dapat digunakan untuk memanipulasi data dalam object. Hal ini sangat penting, terutama saat bekerja dengan object yang memiliki banyak properti.

Jika kita membutuhkan nilai (value), maka sebaiknya menggunakan looping for biasa atau for of.

Manfaat Perulangan For In

Berikut beberapa manfaat menggunakan perulangan for in dalam konteks web development:

  • Efisiensi dalam mengelola object: for in sangat efektif untuk mengiterasi properti dalam object, yang merupakan struktur data umum dalam JavaScript. Proses ini memudahkan developer mengakses dan memanipulasi data object.
  • Kode lebih clean dan terorganisasi: menggunakan for in membantu mengurangi jumlah baris kode yang diperlukan untuk mengiterasi properti object. Dengan begitu, kode lebih clean dan mudah dibaca.
  • Fleksibilitas dalam penggunaan: for in juga bisa dipakai pada object dengan jumlah properti yang tidak diketahui atau berubah-ubah, membuatnya sangat fleksibel untuk berbagai kasus penggunaan.
  • Memudahkan debugging dan maintenance: dengan struktur yang jelas dan terorganisasi, for in memudahkan proses debugging dan pemeliharaan kode, terutama dalam proyek besar.
  • Penggunaan dalam DOM manipulation: for in berguna dalam manipulasi DOM, seperti saat mengiterasi object yang berisi referensi elemen DOM atau properti style.
  • Terintegrasi dengan fitur JavaScript lain: for in dapat dengan mudah dikombinasikan dengan fitur JavaScript lain seperti if conditional atau metode Array.prototype.forEach untuk kasus yang lebih kompleks. 

Syntax JavaScript For In

Syntax dasar dari for in dalam JavaScript adalah sebagai berikut:

  • Variable: variabel yang akan menerima key properti dari object pada setiap iterasi.
  • Object: object yang properti-propertinya akan diiterasi.

Cara Menggunakan JavaScript Perulangan For In dan Contohnya

Selanjutnya, mari kita lihat cara menggunakan penggunaan for in. Misalkan kita memiliki object yang menyimpan informasi tentang berbagai jenis buah dan stoknya di sebuah toko:

#1 Menampilkan informasi stok buah

Dalam contoh di atas, for in dipakai untuk mengiterasi melalui setiap properti dalam object stokBuah. Pada setiap iterasi, nama buah dan jumlah stoknya ditampilkan ke console. Hal ini sangat membantu, misalnya, untuk menampilkan informasi stok pada dashboard sebuah aplikasi manajemen toko.

#2 Menambahkan pajak pada setiap buah

Misalnya kita ingin menambahkan pajak sebesar 10% pada harga setiap buah. Kita bisa menggunakan for in untuk mengiterasi melalui object dan meng-update harganya.

Dalam contoh di atas, kita mengiterasi melalui object hargaBuah dan mengupdate harga setiap buah dengan menambahkan 10% pajak. Hasilnya kemudian di-print ke console.

FAQ (Frequently Asked Question)

Apakah perulangan for in dapat digunakan untuk mengiterasi elemen-elemen dalam array?

Meskipun secara teknis mungkin menggunakan for in untuk mengiterasi elemen dalam array, proses ini tidak disarankan.

For in dirancang untuk mengiterasi properti object, bukan elemen array. Menggunakannya pada array bisa menghasilkan output tidak terduga, terutama jika array tersebut telah dimodifikasi dengan properti tambahan. Untuk mengiterasi array, lebih baik menggunakan for, for of, atau metode array seperti forEach.

RevoU Staff
Kickstart your career in tech with RevoU!
Menu