Memahami Kaedah Array Iterator dalam JS: penapis, peta dan kurangkan

JavaScript mempunyai kaedah lelaran terbina dalam untuk transformasi tatasusunan. Mari analisa filter(), map(), dan reduce() serta syarat yang harus digunakan.

Array.filter()

Ia mencipta tatasusunan baharu dengan semua elemen yang lulus ujian yang dilaksanakan oleh fungsi yang disediakan. Ia memanggil fungsi panggil balik yang disediakan sekali untuk setiap elemen dalam tatasusunan dan mengembalikan tatasusunan baharu bagi semua nilai yang mana fungsi panggil balik kembali benar.

Sintaks

filter(callbackFn)
filter(callbackFn, thisArg)

Ia menilai kepada: Array.filter((elemen, indeks, tatasusunan) => { ... } )

Panggil balikFn ialah fungsi untuk melaksanakan bagi setiap elemen dalam tatasusunan yang sepatutnya mengembalikan nilai sebenar untuk mengekalkan elemen tatasusunan yang terhasil dan nilai palsu sebaliknya. Fungsi ini mengambil tiga argumen: elemen semasa, indeks dan tatasusunan itu sendiri.

Dalam contoh di bawah, diberikan tatasusunan nombor dan dijangka mencari nombor genap, kaedah penapis() akan digunakan seperti yang ditunjukkan:

const numbers = [1, 2, 3, 4, 5, 6];
const evenNumbers = numbers.filter(number => number % 2 === 0);
console.log(evenNumbers); // Output: [2, 4, 6]

Array.map()

Kaedah map() mencipta tatasusunan baharu yang diisi dengan hasil panggilan fungsi yang disediakan pada setiap elemen dalam tatasusunan semasa. Ia menggunakan fungsi panggil balik hanya untuk indeks tatasusunan yang telah menetapkan nilai dan tidak digunakan untuk slot kosong.

Sintaks

map(callbackFn)
map(callbackFn, thisArg)

Ini hanya diterjemahkan kepada: Arrays.map((elemen, indeks, tatasusunan) => { ... })

Panggil balikFn ialah fungsi untuk melaksanakan bagi setiap elemen dalam tatasusunan dan nilai pulangan ditambah sebagai satu elemen dalam tatasusunan baharu.
Fungsi ini mengambil tiga argumen: elemen semasa, indeks dan tatasusunan itu sendiri.

Memandangkan tatasusunan nombor dan dijangka mengembalikan petaknya, kaedah map() akan paling berkesan seperti yang ditunjukkan di bawah:

const numbers = [1, 2, 3, 4, 5];
const squareNumbers = numbers.map(number => number ** 2);
console.log(squareNumbers); // Output: [1, 4, 9, 16, 25]

Kami sedang memetakan nilai satu tatasusunan kepada tatasusunan yang lain.

Array.reduce()
Kaedah reduce() menjalankan pengurang fungsi panggil balik pada setiap elemen tatasusunan, dalam susunan indeks menaik, menghantar nilai pulangan daripada pengiraan elemen sebelumnya. Hasil akhir menjalankan pengurang merentas semua elemen tatasusunan ialah satu nilai.

Jika nilai awal diberikan, ia akan digunakan sebagai argumen pertama dalam panggilan pertama panggilan balik. Jika tiada nilai awal diberikan, elemen pertama tatasusunan digunakan sebagai nilai awal, maka lelaran akan bermula dari elemen kedua.

Sintaks

reduce(callbackFn)
reduce(callbackFn, initialValue)

Panggil balikFn ialah fungsi untuk melaksanakan bagi setiap elemen dalam tatasusunan. Nilai pulangannya menjadi nilai parameter penumpuk pada panggilan balik seterusnya. Untuk seruan terakhir, nilai pulangan menjadi nilai pulangan fungsi reduce().
Ia memerlukan hujah berikut: accumulator, currentValue, currentIndex dan tatasusunan yang digunakan.

Menggunakan tatasusunan nombor dan ditugaskan untuk mencari jumlahnya, kaedah reduce() akan menilai dengan mudah seperti yang ditunjukkan di bawah:

const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((accumulator, currentValue) => accumulator + currentValue, 0);
console.log(sum); // Output: 15

Kesimpulan
Kaedah penapis(), map() dan reduce() ini penting untuk lelaran dan manipulasi tatasusunan.

• filter() paling sesuai digunakan untuk mencari semua elemen dalam tatasusunan tertentu yang memenuhi kriteria fungsi panggil balik.

• map() ialah kaedah tatasusunan tidak merosakkan yang terbaik digunakan untuk memanipulasi data dalam tatasusunan tertentu dan mengharapkan nilai pulangan.

• reduce() berguna untuk mengagregatkan elemen tatasusunan menjadi satu nilai berdasarkan fungsi pengurang.

Rujukan

• Dokumen Web MDN pada Array.prototype.filter

• Dokumen Web MDN pada Array.prototype.map

• Dokumen Web MDN pada Array.prototype.reduce

Atas ialah kandungan terperinci Memahami Kaedah Array Iterator dalam JS: penapis, peta dan kurangkan. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!