Cara menggunakan find array key javascript

Question

filter() merupakan method array di JavaScript yang berfungsi untuk mencari semua elemen di dalam array yang sesuai dengan kriteria tertentu.

Table of Contents Show

Memfilter Bilangan Genap
Memfilter Objek Dalam Array
Perbedaan filter() dan find()
Bagaimana cara buat array di JavaScript?
Apa itu array di JavaScript?
Method apa yang dapat kita gunakan untuk memilih elemen array berdasarkan kondisi tertentu dan akan membuat sebuah array baru?
Apa itu Map di JavaScript?

Method ini mengembalikan array baru yang berisi elemen yang sesuai dengan kriteria yang dicari atau lulus pengujian fungsi callback.

Mirip seperti find(), alih-alih mengembalikan satu elemen, filter() mengembalikan semua elemen.

Method ini mengembalikan array baru, tidak mengubah array asli atau sumber.

Mari kita pelajari lebih lanjut method array filter() mulai dari sintaks dan contoh penggunaannya.

Sintaks

// Arrow function
filter((elemen, index, array) => { ... })

// Callback function
filter(callbackFn, thisValue)

Parameter

callbackFn: fungsi untuk menguji setiap elemen array, agar elemen sesuai kriteria, fungsi ini harus mengembalikan nilai

const values = [1, 2, 3, 4, 5, 6, 7, 8, 9];

const value = values.filter((elemen) => elemen % 2 === 0);

console.log(value); // [ 2, 4, 6, 8 ]

0 (

const values = [1, 2, 3, 4, 5, 6, 7, 8, 9];

const value = values.filter((elemen) => elemen % 2 === 0);

console.log(value); // [ 2, 4, 6, 8 ]

1). Fungsi ini menerima tiga arguman berikut:

const values = [1, 2, 3, 4, 5, 6, 7, 8, 9];

const value = values.filter((elemen) => elemen % 2 === 0);

console.log(value); // [ 2, 4, 6, 8 ]

2: elemen saat ini yang sedang diproses.

const values = [1, 2, 3, 4, 5, 6, 7, 8, 9];

const value = values.filter((elemen) => elemen % 2 === 0);

console.log(value); // [ 2, 4, 6, 8 ]

3 (opsional): index elemen saat ini yang sedang diproses.

const values = [1, 2, 3, 4, 5, 6, 7, 8, 9];

const value = values.filter((elemen) => elemen % 2 === 0);

console.log(value); // [ 2, 4, 6, 8 ]

4 (opsional): array sumber.

const values = [1, 2, 3, 4, 5, 6, 7, 8, 9];

const value = values.filter((elemen) => elemen % 2 === 0);

console.log(value); // [ 2, 4, 6, 8 ]

5 (opsional): Nilai yang digunakan sebagai nilai

const values = [1, 2, 3, 4, 5, 6, 7, 8, 9];

const value = values.filter((elemen) => elemen % 2 === 0);

console.log(value); // [ 2, 4, 6, 8 ]

6 saat callbackFn dieksekusi.

Nilai Kembalian

Mengembalikan array baru yang berisi semua elemen yang lulus pengujian fungsi callback atau sesuai kriteria.

Jika tidak ada elemen yang sesuai kriteria, method ini mengembalikan array kosong.

Contoh

Memfilter Bilangan Genap

Mari kita gunakan contoh sederhana, mencari bilangan genap di dalam array.

const values = [1, 2, 3, 4, 5, 6, 7, 8, 9];

const value = values.filter((elemen) => elemen % 2 === 0);

console.log(value); // [ 2, 4, 6, 8 ]

Method ini mengembalikan array berisi elemen yang sesuai dengan kriteria tertentu, dalam hal ini bilangan genap (

const values = [1, 2, 3, 4, 5, 6, 7, 8, 9];

const value = values.filter((elemen) => elemen % 2 === 0);

console.log(value); // [ 2, 4, 6, 8 ]

8).

Karena array

const values = [1, 2, 3, 4, 5, 6, 7, 8, 9];

const value = values.filter((elemen) => elemen % 2 === 0);

console.log(value); // [ 2, 4, 6, 8 ]

9 memiliki lebih dari satu bilangan genap maka semuanya akan dimasukkan ke dalam array.

Berbeda dengan find() yang hanya mengembalikan elemen pertama dan tidak dimasukkan ke array.

Method ini dieksekusi sebanyak jumlah elemen array, oleh karena itu nilai argumen

const values = [1, 2, 3, 4, 5, 6, 7, 8, 9];

const value = values.filter((elemen) => elemen % 2 === 0);

console.log(value); // [ 2, 4, 6, 8 ]

2 berubah-ubah secara berurutan mulai dari elemen array pertama hingga akhir.

Artinya kita di sini menguji setiap elemen array.

Kita bisa menggunakan beragam jenis fungsi termasuk anonymous function expression sebagai callback, fungsi callback dapat dideklarasikan di luar fungsi dan memasukkannya ke parameter

const users = [
  {
    name: 'budi',
    age: 23,
    gender: 'male',
  },
  {
    name: 'nanda',
    age: 20,
    gender: 'female',
  },
  {
    name: 'ucup',
    age: 45,
    gender: 'male',
  },
];

const usersMale = users.filter((user) => user.gender === 'male');

console.log(usersMale);
/* output:
[
  { name: 'budi', age: 23, gender: 'male' },
  { name: 'ucup', age: 45, gender: 'male' }
]
*/

2.

Memfilter Objek Dalam Array

Saat membuat aplikasi, filter() sering digunakan untuk memfilter objek di dalam array.

Contoh berikut memfilter objek di dalam array

const users = [
  {
    name: 'budi',
    age: 23,
    gender: 'male',
  },
  {
    name: 'nanda',
    age: 20,
    gender: 'female',
  },
  {
    name: 'ucup',
    age: 45,
    gender: 'male',
  },
];

const usersMale = users.filter((user) => user.gender === 'male');

console.log(usersMale);
/* output:
[
  { name: 'budi', age: 23, gender: 'male' },
  { name: 'ucup', age: 45, gender: 'male' }
]
*/

4 dengan properti

const users = [
  {
    name: 'budi',
    age: 23,
    gender: 'male',
  },
  {
    name: 'nanda',
    age: 20,
    gender: 'female',
  },
  {
    name: 'ucup',
    age: 45,
    gender: 'male',
  },
];

const usersMale = users.filter((user) => user.gender === 'male');

console.log(usersMale);
/* output:
[
  { name: 'budi', age: 23, gender: 'male' },
  { name: 'ucup', age: 45, gender: 'male' }
]
*/

5 yang bernilai

const users = [
  {
    name: 'budi',
    age: 23,
    gender: 'male',
  },
  {
    name: 'nanda',
    age: 20,
    gender: 'female',
  },
  {
    name: 'ucup',
    age: 45,
    gender: 'male',
  },
];

const usersMale = users.filter((user) => user.gender === 'male');

console.log(usersMale);
/* output:
[
  { name: 'budi', age: 23, gender: 'male' },
  { name: 'ucup', age: 45, gender: 'male' }
]
*/

6.

const users = [
  {
    name: 'budi',
    age: 23,
    gender: 'male',
  },
  {
    name: 'nanda',
    age: 20,
    gender: 'female',
  },
  {
    name: 'ucup',
    age: 45,
    gender: 'male',
  },
];

const usersMale = users.filter((user) => user.gender === 'male');

console.log(usersMale);
/* output:
[
  { name: 'budi', age: 23, gender: 'male' },
  { name: 'ucup', age: 45, gender: 'male' }
]
*/

Perbedaan filter() dan find()

Secara sintaks, kedua method identik, yang perlu diperhatikan adalah nilai kembalian dan jumlah elemen yang dikembalikan.

filter() selalu mengembalikan array terlepas dari apakah elemen sesuai kriteria atau tidak.

Semua elemen tersebut dimasukkan ke dalam array, atau mengembalikan array kosong jika tidak ada yang sesuai.

find() hanya mengembalikan satu elemen pertama meskipun array memiliki banyak elemen yang sesuai kriteria, atau filter()1 jika tidak ada elemen yang sesuai.

Bagaimana cara buat array di JavaScript?

Pada javascript, array dapat kita buat dengan tanda kurung siku ( [...] ). Contoh: var products = []; Maka variabel products akan berisi sebuah array kosong.

Apa itu array di JavaScript?

Array merupakan suatu variabel yang dapat menyimpan banyak data. Dalam javascript indeks array secara default adalah bilangan bulat yang diawali dengan 0 (nol), tetapi kita dapat mengubah indeks array sesuai dengan keinginan kita.

Method apa yang dapat kita gunakan untuk memilih elemen array berdasarkan kondisi tertentu dan akan membuat sebuah array baru?

filter() Metode ini berfungsi untuk membuat sebuah array baru dengan memperhatikan kondisi tertentu pada setiap elemen dari array yang sudah ada.

Apa itu Map di JavaScript?

. map() dapat digunakan untuk melakukan iterasi objek dalam suatu array dan, dengan cara yang serupa seperti array tradisional, memodifikasi konten dari setiap objek individu dan memberikan array yang baru. Modifikasi ini dilakukan berdasarkan apa yang dikembalikan dalam fungsi callback.

kode javascript