Apa perbedaan antara peta () dan temukan () dalam javascript?

Contoh

Kembalikan array baru dengan akar kuadrat dari semua nilai elemen

angka const = [4, 9, 16, 25];
const newArr = angka. peta (Matematika. persegi)

Kalikan semua nilai dalam array dengan 10

angka const = [65, 44, 12, 4];
const newArr = angka. peta(myFunction)

function myFunction(num) {
mengembalikan angka * 10;
}

Lebih banyak contoh di bawah ini

Definisi dan Penggunaan

map() membuat larik baru dari pemanggilan fungsi untuk setiap elemen larik

map() memanggil fungsi satu kali untuk setiap elemen dalam array

map() tidak menjalankan fungsi untuk elemen kosong

map() tidak mengubah array asli

Sintaksis

Himpunan. peta(fungsi(Nilaisaat ini, indeks, arr),Nilaiini)

Parameter

Nilai Pengembalian

Lebih Banyak Contoh

Dapatkan nama lengkap untuk setiap orang

const orang = [
{nama depan. "Malcolm", nama belakang. "Reynolds"},
{nama depan. "Kaylee", nama belakang. "Goreng"},
{nama depan. "Jayne", nama belakang. "Cobb"}
];

orang. peta(getFullName);

fungsi getFullName(item) {
barang yang dikembalikan. nama depan, item. nama keluarga]. Ikuti(" ");
}

Dukungan Peramban

map() adalah fitur ECMAScript5 (ES5).

ES5 (JavaScript 2009) didukung penuh di semua browser

Pertanyaan wawancara umum yang sering ditanyakan oleh pengembang JavaScript adalah menjelaskan perbedaan antara metode find() dan filter()

Dalam tutorial hari ini, saya akan memandu Anda melalui apa metode ini dan kapan Anda harus menggunakannya

Apa metode filter()?

Metode ini mengembalikan semua elemen array yang memenuhi kondisi yang ditentukan dalam fungsi callback

Mari kita lihat dengan contoh bagaimana cara kerjanya

const x = [1, 2, 3, 4, 5];

const y = x.filter(el => el*2 === 2);

console.log("y is: ", y); // y is: [1]

Jika Anda melihat output dari contoh di atas, nilai y adalah array dari 1 elemen yang memenuhi syarat. Ini karena metode filter() mengulangi semua elemen array dan kemudian mengembalikan array yang difilter yang memenuhi kondisi yang ditentukan

Apa metode find()?

Metode ini mengembalikan elemen pertama dari larik yang memenuhi kondisi yang ditentukan dalam fungsi callback

Mari kita lihat dengan contoh bagaimana cara kerjanya

const x = [1, 2, 3, 4, 5];

const y = x.find(el => el*2 === 2);

console.log("y is: ", y); // y is: 1

Sekarang, jika Anda melihat output dari contoh di atas, nilai y adalah 1. Ini karena metode find() mencari elemen pertama dalam larik yang memenuhi kondisi yang ditentukan

Perbedaan utama antara contoh di atas adalah

1. filter() mengembalikan array yang berisi elemen yang memenuhi kondisi, tetapi find() mengembalikan elemen itu sendiri yang memenuhi kondisi
2. Di filter()_, seluruh array diulang meskipun faktanya elemen yang dicari ada di awal. Tapi di find(), segera setelah elemen yang memenuhi kondisi ditemukan, elemen itu dikembalikan

Kasus Penggunaan untuk find() dan filter()

Ketika Anda memiliki kasus penggunaan di mana lebih dari 1 elemen diharapkan dikembalikan dan Anda ingin melakukan operasi pada semua elemen, maka Anda dapat menggunakan metode filter(). Tetapi jika Anda mengharapkan hanya satu elemen yang dikembalikan dari array, maka Anda dapat menggunakan find() dan menghindari iterasi tambahan

Mari kita lihat contoh dari kedua kasus penggunaan tersebut

1. filter() contoh kasus penggunaan

const x = [1, 2, 3, 4, 5];

const y = x.filter(el => el%2 === 0);

console.log("y is: ", y); // y is: [2, 4]

Dalam contoh di atas,

const x = [1, 2, 3, 4, 5];

const y = x.find(el => el*2 === 2);

console.log("y is: ", y); // y is: 1

2. find() contoh kasus penggunaan

const emp = [
    {
        name: "Ram",
        empID: 101
    },
    {
        name: "Sham",
        empID: 102
    },
    {
        name: "Mohan",
        empID: 103
    }
];

const res = emp.find(el => el.empID === 102);

console.log("res is: ", res); // res is: {name: 'Sham', empID: 102}

Dalam contoh di atas,

const x = [1, 2, 3, 4, 5];

const y = x.find(el => el*2 === 2);

console.log("y is: ", y); // y is: 1

const x = [1, 2, 3, 4, 5];

const y = x.find(el => el*2 === 2);

console.log("y is: ", y); // y is: 1

const x = [1, 2, 3, 4, 5];

const y = x.find(el => el*2 === 2);

console.log("y is: ", y); // y is: 1

Terima kasih sudah membaca

Jika Anda menemukan artikel ini bermanfaat, bagikan dengan teman dan kolega Anda

IKLAN

IKLAN

IKLAN

Aman Kalra

Insinyur Frontend

Jika artikel ini bermanfaat, tweetlah

Belajar kode secara gratis. Kurikulum open source freeCodeCamp telah membantu lebih dari 40.000 orang mendapatkan pekerjaan sebagai pengembang. Memulai

Bagaimana cara menggunakan find dan map di JavaScript?

Apa yang dilakukan find () dalam JavaScript?

Untuk apa metode peta () digunakan?

Apa perbedaan antara map forEach filter dan find?

Apa manfaat menggunakan metode peta ()?

Kapan menggunakan peta dalam JavaScript?