filter

const nums = [10, 20, 111, 222, 444, 40, 50];

需求:取出小於100的數

//每次回撥函式時自動填入形參n，第一次是10，第二次是20...
//filter中回撥函式必須返回一個boolean值
//當返回true時,函式內部會自動將這次回撥的n加入到新的陣列中
//當返回false時,就會過濾掉n
let newNums = nums.filter(function (n) {
// n小於100的結果就是true，大於等於就是false
    return n < 100
});
console.log(newNums);
// newNums=[10,20,40,50]

map

需求:將新的數組裡面全部的數乘以2

//相同的是回撥函式必須返回值，返回的值替代n
let newNums2 = newNums.map(function (n) {
   return n*2
});
console.log(newNums2);
// newNums2=[20,40,80,100]

reduce

需求:求數組裡面所有值的和

// reduce將數組裡面的所有內容匯合處理。
// 第一個引數是上一次返回的值,第二個引數是這次使用的值
// 將回調函式視為第一個引數,第二個引數(也就是0)是初始值
// index 是當前元素的索引
// arr是當前元素的物件
let newNums3 = newNums2.reduce(function (preValue, n, index, arr) {
  return preValue + n
}, 0);
console.log(newNums3);
// newNums3=240
 

最後可以一次複合寫完最後的需求。

let total = nums.filter(function (n) {
    return n<100
}).map(function (n) {
    return n*2
}).reduce(function (preValue, n) {
    return preValue + n
}, 0);
console.log(total);

es6語法一句話寫完。

let total2 = nums.filter(n => n<100).map(n => n*2).reduce((pre, n) => pre+n);
console.log(total2);