下面演示下面四個常用遍歷
回圈（迭代）：forEach((item(值),index(下標))=>{})；
過濾器：filter()
匯總：reduce()
映射：map()
現在假設我們有這三個需求
1.需求：將所有小于100的數字
2.需求：將所有小于100的數字進行轉化：全部*2
3.需求：將所new2Nums數字相加，得到最終結果
直接代碼詳細注釋
// filter/map/reduce
// filter中回呼函式有一個要求：必須回傳一個boolean值
// true:當回傳true時，函式內部會自動將這次回呼的n加入到新的陣列中
// false：當回傳false時，函式內部會過濾掉這次的n
// 下面都是 函式式編程（第一公民：函式）
const nums = [10, 20, 111, 222, 444, 40, 50]
// 一、鏈式編程
// let total = nums.filter(n => n < 100).map(n => n * 2).reduce((pre, n) => pre + n);
// console.log(total);
//二、普通寫法
// 1.filter函式的使用
// 把小于100的都篩選出來了
// 10，20，40，50
let newNums = nums.filter(function (n) {
return n < 100
})
console.log(newNums);
// 2.map函式的使用
// 有幾個數就回圈幾次，回傳新陣列
//20，40，80，100
let new2Nums = newNums.map(function (n) { //20
return n * 2
})
console.log(new2Nums);
// 3.reduce函式的使用
// 陣列幾個值遍歷幾次
// reduce作用對陣列中所有內容進行匯總
let total = new2Nums.reduce(function (preValue, n) {
return preValue + n
}, 0)
// 第一次：preValue 0 n 20
// 第二次：preValue 20 n 40
// 第三次：preValue 60 n 80
// 第四次：preValue 140 n 100
//240
console.log(total);最后補充小知識點
編程范式：命令式編程/宣告式編程
編程范式：面向物件編程（第一公民：物件）/函式式編程（第一公民：函式）
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/295429.html
標籤：其他
上一篇：CSS 影片