ECMAScript mendefinisikan 5 metode iterasi untuk array. Setiap metode menerima dua parameter: fungsi yang akan dijalankan dengan setiap item sebagai argumen, dan objek cakupan opsional sebagai konteks di mana fungsi tersebut dijalankan (memengaruhi nilai this dalam fungsi). Fungsi yang diteruskan ke setiap metode menerima tiga parameter: elemen array, indeks elemen, dan array itu sendiri. Tergantung pada metode spesifiknya, hasil dari fungsi ini mungkin mempengaruhi atau tidak mempengaruhi nilai kembalian metode. 5 metode iterasi array adalah sebagai berikut.
1. Metode peta: Jalankan fungsi yang diteruskan pada setiap item array dan kembalikan array yang terdiri dari hasil setiap pemanggilan fungsi.
Ini juga dapat dipahami sebagai: setelah melakukan pemrosesan khusus pada setiap elemen dalam array, kembalikan array baru .
Misalnya:
sebelum menyederhanakan susunan harga:
misalkan harga=[50,80,90] harga=harga.peta((barang,indeks)=>{ barang kembalian+"yuan" })
Setelah singkatan dari
console.log(prices):
let price=[50,80,120] //Tambahkan "yuan" setelah harga satuan harga=harga.peta(item=>item+"yuan") console.log(price)//Outputnya adalah ['50 yuan', '80 yuan', '90 yuan']
Skenario penerapannya misalnya: Applet WeChat Douban Film Review
menggunakan metode peta untuk mengganti xxx dengan www
replace( ) metode Digunakan untuk mengganti beberapa karakter dengan karakter lain dalam sebuah string, atau mengganti substring yang cocok dengan ekspresi reguler.
biarkan movie=[{id:1,name:"Shawshank Redemption",imgUrl:"http://xxx.douban.com/1.jpg"},{id:2,name:"Shawshank Redemption",imgUrl :" http://xxx.douban.com/2.jpg"},{id:3,nama:"Penebusan Shawshank",imgUrl:"http://xxx.douban.com/1.jpg"}] film=film.peta(item=>{ item.imgUrl=item.imgUrl.replace("xxx","www") barang kembali }) console.log(movies)
2. Metode filter: Jalankan fungsi yang diteruskan pada setiap item array. Item yang dikembalikan oleh fungsi true akan membentuk array dan kembali.
Hal ini juga dapat dipahami sebagai: memfilter elemen dalam array yang memenuhi persyaratan dan mengembalikan array baru
let score=[80,59,10,55,90,88] biarkan arr=scores.filter(item=>{ jika(barang>60){ kembali benar } }) console.log(arr)//Output seperti yang ditunjukkan di bawah ini:
Output seperti yang ditunjukkan di bawah ini dan memfilter array kurang dari 60
Setelah singkatan:
let score=[80,59,10,55,90,88] biarkan arr=scores.filter(item=>item>=60) console.log(arr)//(3) [80, 90, 88]
Dalam skenario penerapannya, Anda dapat menempatkan array nama kota dan kemudian mencari kata kunci sebuah buku tentang contohnya nanti. Skenario penerapan sistem manajemen akan menyertakan pencarian kata kunci untuk referensi.
Some diterjemahkan dalam bahasa Inggris sebagai some, dan every diterjemahkan sebagai semua, masing-masing, sehingga metode some akan menghasilkan nilai true selama salah satu dari metode tersebut benar.
semuametode
harus mengembalikan nilai benar sebelum dapat mengembalikan nilai benar, meskipun ada satu nilai salah, nilai salah akan dikembalikan.
Selama proses penilaian array, dinilai apakah setiap elemen dari keseluruhan memenuhi persyaratan dasar
benar, selama salah satunya cocok, hasilnya akan benar.
setiap metode: satu salah adalah salah, selama salah satunya tidak memenuhi persyaratan, maka akan menghasilkan false
//biarkan skor semua siswa di kelas untuk melihat apakah semua orang telah lulus biarkan skor=[80,49,12 ,50,69 ] biarkan hasil=skor.setiap(item=>item>=60) console.log(result)//Return false Tidak semua lolos.
Skenario penggunaan: Sebelum validator front-end mengirimkan permintaan AJAX, biasanya semua verifikasi harus lulus sebelum dapat dikirim artikel tentang contoh kode.
5. Metode pengurangan: ECMAScript menyediakan dua metode penggabungan untuk array: pengurangan() dan penguranganRight(). Kedua metode mengulangi semua item array dan membuat nilai pengembalian akhir berdasarkan ini. Metode pengurangan() melintasi dari item pertama ke item terakhir dalam array. Dan penguranganRight() melintasi dari item terakhir ke item pertama. Ini juga dapat dipahami secara sederhana sebagai: mengintegrasikan elemen-elemen dalam array dan mengembalikan konten baru.
Kedua metode menerima dua parameter: fungsi penggabungan untuk dijalankan pada setiap item, dan nilai awal opsional untuk memulai penggabungan. Fungsi yang diteruskan ke pengurangan() dan penguranganRight() menerima empat parameter: nilai gabungan sebelumnya, item saat ini, indeks item saat ini, dan array itu sendiri. Nilai apa pun yang dikembalikan oleh fungsi ini akan digunakan sebagai argumen pertama pada panggilan berikutnya ke fungsi yang sama. Jika parameter opsional kedua (sebagai nilai awal penggabungan) tidak diteruskan ke kedua metode ini, iterasi pertama akan dimulai dari item kedua dalam larik, sehingga parameter pertama yang diteruskan ke fungsi gabungan adalah larik. parameter kedua adalah item kedua dari array.
Pertama-tama pahami konsepnya melalui kode berikut:
arti dari empat parameter dalam kode berikut:
prev: hasil yang dikembalikan oleh
item operasi sebelumnya: elemen dari operasi ini
indeks: nilai indeks dari elemen
array operasi ini: the array operasi saat ini
biarkan arr =[20,40,50,21] biarkan nilai=arr.reduce((prev,item,index,array)=>{ konsol.log("sebelumnya"+sebelumnya) konsol.log("barang"+barang) konsol.log("indeks"+indeks) konsol.log("array"+array) konsol.log("______") })
Outputnya adalah:
Mengapa hanya berulang tiga kali? Sebelumnya dapat menetapkan nilai default. Jika nilai default tidak disetel, elemen pertama akan menjadi sebelumnya yang pertama.
Mengapa prev menjadi tidak terdefinisi pada loop kedua dan ketiga? Pada loop kedua, Anda harus mendapatkan nilai kembalian dari loop pertama karena pengembalian tidak disetel pertama kali, sehingga Anda menjadi tidak terdefinisi. Dan seterusnya.
Jika Anda memahami hal di atas, maka kita mulai mengimplementasikan penjumlahan array:
biarkan arr=[20 ,40,50,21] biarkan nilai=arr.reduce((prev,item,index,array)=>{ konsol.log("sebelumnya"+sebelumnya) kembalikan sebelumnya+item //Berikan pengembalian dan perulangan empat kali. Pertama kali keluaran sebelumnya adalah 20, kedua kalinya 40+20 adalah 60, ketiga kalinya adalah 110 dan terakhir kali menghasilkan 131. }) console.log(values) //131
Kapan nilai default prev harus disetel?
Tambahkan <li> </li> ke setiap elemen array
let arr=["Eason Chan","Miriam Yeung","Juji Ku","Hacken Lee"] //Tetapkan nilai default untuk sebelumnya: Fungsi 1. Semua elemen berpartisipasi dalam perulangan 2. Tentukan konten yang dikembalikan biarkan result=arr.reduce((prev,item)=>{ //konsol.log(sebelumnya) kembalikan sebelumnya+"<li>"+item+"</li>" },"")//Tambahkan string kosong console.log(result)//<li>Eason Chan</li><li>Miriam Yeung</li><li>Juji Ku</li><li>Keqin Li</li> li>
Mari kita ambil kasus lain:
gunakan pengurangan untuk mencapai deduplikasi array, buat array kosong, telusuri array asli secara berurutan, masukkan apa yang tidak ada dalam array kosong, dan apa yang tidak dimasukkan tidak akan dimasukkan lagi
biarkan arr=["Zhang San"," Li Si","Li Si","Wang Er","Li Si","Mazi","Zhang San"] biarkan hasil=arr.reduce((prev,item)=>{ //Includes menentukan apakah ada elemen tertentu dan mengembalikan t, jika tidak maka akan mengembalikan f. if(!prev.includes(item)){ prev.push(item) //.push() menambahkan item baru ke array} kembali sebelumnya },[])//Tetapkan array kosong default console.log(result)//(4) ['Zhang San', 'Li Si', 'Wang Er', 'Mazi']
Kasus lain: (kurangi metode Anda dapat melakukan banyak hal)
menghitung jumlah kemunculan karakter: lihat kode di bawah
let arr=["a","b","a","c","b","a","c"] //Mengembalikan objek untuk menghitung jumlah kemunculan tiap karakter {a:2,w:3} biarkan hasil=arr.reduce((prev,item)=>{ // //Tentukan apakah objek mempunyai atribut yang sesuai if(item in prev){ //Temukan nilai atribut yang sesuai++ prev[item]++ //Jika ingin menyetel atau mendapatkan atribut objek di kemudian hari, atribut ini akan diwakili oleh variabel dalam bentuk tanda kurung []++, jika langsung. Nama atribut akan di bentuk.}else{ sebelumnya[item]=1 } kembali sebelumnya },{}) console.log(hasil)//{a: 3, b: 2, c: 2}