Hello, Spirit of Learning!🔥
Pada artikel kali ini kita akan membahas penggunaan method filter() yang ada pada Array Prototype JavaScript. Buat kamu yang belum belajar JavaScript dasar, kamu bisa belajar terlebih dahulu ya di Kelas JavaScript ES6 Dasar dan buat kamu yang ingin belajar method filter() alangkah baiknya membaca artikel sebelumnya, yaitu "Memahami Array Prototype dalam JavaScript".
Mungkin kamu pernah mendengar tentang method filter, mungkin juga tidak. Namun, jangan khawatir! Dalam artikel ini, kita akan mengupasnya secara perlahan. Method filter adalah cara yang luar biasa untuk menyaring dan mengatur array kamu tanpa perlu terjebak dalam kebingungan loop dan kondisional yang membingungkan.
Mari kita mulai dengan memahami apa sebenernya method filter itu, dan bagaimana kita bisa menggunakannya untuk memperbaiki kode kita dengan mudah.
Pengenalan Method Filter
Pernahkah kamu merasa repot saat harus memilah-milah data dalam array di JavaScript? Nah, di situlah method filter digunakan. Jadi, method filter itu seperti penyaring otomatis yang bisa membantu kita menemukan item-item yang kita butuhkan dalam array dengan lebih mudah.
Jadi begini, bayangkan kamu memiliki daftar nama-nama buah dalam sebuah array. Tapi tiba-tiba kamu hanya ingin menampilkan buah-buah yang berawalan huruf A. nah, itulah saatnya method filter bertindak. Ia akan membantu kamu menyaring buah-buah tersebut hanya dengan beberapa baris kode sederhana
Jadi, intinya, method filter ini seperti alat penyaring yang bisa menyeleksi item-item yang sesuai dengan kriteria yang kamu tentukan. Praktis bukan? Baiklah, mari kita telusuri lebih dalam bagaimana cara menggunakan method filter ini.
Cara Penggunaan Method Filter
Method filter dalam JavaScript itu keren banget, karena bisa bikin ngoding kita lebih mudah. Jadi begini, kita punya array yang berisi banyak data kan? Nah, dengan method filter, kita bisa mengambil data dari array itu berdasarkan kriteria tertentu.
Contohnya begini, kita punya array numbers yang berisi daftar angka. Misalnya angka 1 sampai 5. Nah, sekarang kita pengen mengambil hanya angka-angka yang lebih besar dari 2 aja. Nah, di sinilah method filter akan digunakan.
const numbers = [1, 2, 3, 4, 5];Jadi, selanjutnya begini: kita panggil array numbers, terus tambahin .filter() di dalam kurung method filter() , kita kasih sebuah function (biasanya disebut callback function). Function ini yang akan nentuin kriteria apa yang kita mau.
Contoh kode seperti ini:
const numbersGreaterThanTwo = numbers.filter(function(item) {
return item > 2;
});
console.log(numbersGreaterThanTwo);
Jadi, di sini kita punya array numbers, terus kita filter angka mana aja yang lebih besar dari 2. Nah, angka-angka yang memenuhi syarat itu akan dimasukkan ke dalam array baru yang kita namakan numbersGreaterThanTwo Gampang kan? Nah, itu dia cara menggunakan method filter dalam JavaScript. Seru kan? Kamu bisa bereksperimen sendiri dengan berbagai kriteria filter yang kamu mau!
Contoh Penggunaan Method Filter Selanjutnya
Misalkan kita memiliki array nama-nama orang dan kita ingin membuat array baru yang hanya berisi nama-nama yang memiliki lebih dari lima huru
const names = ["Alya", "Budi", "Citra", "Dewi", "Eko", "Fani", "Gilang", "Hani"];
Dalam contoh di atas, kita memiliki array names yang berisi daftar nama orang. Kemudian, kita menggunakan method filter pada array tersebut.
const longNames = names.filter(function(name) {
return name.length > 5;
});
console.log(longNames);
Method filter menerima sebuah callback function sebagai argumennya. Callback function ini akan dieksekusi untuk setiap elemen dalam array dan elemen-elemen yang memenuhi kriteria yang akan ditentukan dalam callback function akan disaring dan dimasukkan ke dalam array baru.
Di dalam callback function, kita menggunakan kondisi name.length > 5 untuk memeriksa apakah sebuah nama memilki lebih dari lima huruf. Jika nama tersebut memiliki lebih dari lima huruf, maka nama tersebut akan disertakan dalam array baru.
Dengan menggunakan method filter, kita berhasil membuat array baru yang berisi nama-nama dengan lebih dari lima huruf dari array aslinya dengan cara yang jelas dan efisien.
Keuntungan Menggunakan Method Filter
1. Memudahkan Seleksi Data Method filter memungkinkan kamu untuk dengan mudah memilih elemen-elemen tertentu dari sebuah array berdasarkan kriteria tertentu.
2. Kode Lebih Bersih Dengan menggunakan method filter, kode kamu cenderung lebih bersih dan lebih mudah dipahami. Kamu tidak perlu menulis loop atau kode yang rumit untuk melakukan seleksi data.
3. Mengurangi Peluang Kesalahan Karena method filter mengurangi kebutuhan untuk menulis kode yang rumit, ini juga mengurangi peluang terjadinya kesalahan. Kamu lebih sedikit bergantung pada loop dan pengaturan manual.
Dengan memanfaatkan method filter, kamu dapat membuat kode kamu menjadi clean code, lebih terstruktur dan lebih mudah di-maintenance.
Kesimpulan
Dengan menggunakan method filter pada array JavaScript, Kamu dapat dengan mudah menyaring dan memanipulasi data sesuai kebutuhan kamu. Method filter memungkinkan kamu untuk membuat array baru berdasarkan kondisi-kondisi tertentu, sehingga memudahkan kamu dalam memproses data dengan cara yang efisien dan terstruktur.
Dalam artikel ini, kita telah mempelajari bagaimana method filter bekerja dengan cara penggunaannya dengan contoh-contoh yang jelas. Dari filter angka lebih dari dua dan filter daftar nama yang lebih dari lima dalam sebuah array.
Mari kita menjadi expert bersama BuildWithAngga🚀
See you guys! ✨
