淺談js中reduce方法

mingzhong 發(fā)布于2019-08-26 10:40 / 915人閱讀

摘要：介紹方法接收一個(gè)函數(shù)作為累加器為數(shù)組中的每一個(gè)元素依次執(zhí)行回調(diào)函數(shù)，不包括數(shù)組中被刪除或從未被賦值的元素，接受四個(gè)參數(shù)初始值上一次回調(diào)的返回值，當(dāng)前元素值，當(dāng)前索引，原數(shù)組。

介紹reduce

reduce() 方法接收一個(gè)函數(shù)作為累加器,reduce 為數(shù)組中的每一個(gè)元素依次執(zhí)行回調(diào)函數(shù)，不包括數(shù)組中被刪除或從未被賦值的元素，接受四個(gè)參數(shù)：初始值（上一次回調(diào)的返回值），當(dāng)前元素值，當(dāng)前索引，原數(shù)組。

語法：arr.reduce(callback,[initialValue])

callback:函數(shù)中包含四個(gè)參數(shù)
- previousValue （上一次調(diào)用回調(diào)返回的值，或者是提供的初始值（initialValue））
- currentValue （數(shù)組中當(dāng)前被處理的元素）
- index （當(dāng)前元素在數(shù)組中的索引)
- array （調(diào)用的數(shù)組）
 
initialValue （作為第一次調(diào)用 callback 的第一個(gè)參數(shù)。）

簡單應(yīng)用

const arr = [1, 2, 3, 4, 5]
const sum = arr.reduce((pre, item) => {
    return pre + item
}, 0)
console.log(sum) // 15

案例 根據(jù)對(duì)象里面的某一項(xiàng)屬性分類,如下效果所示:

let arr = [{index:0},{index:0},{index:1},{index:2},{index:2}];
let res = arr.reduce((pre,item)=>{
 let temp = [];
 pre.forEach((val)=>{
  if(val&&val.length) {
   if(val[0].index==item.index) {
    val.push(item);
    return pre;
   }
  }
 })
 temp.push(item);
 pre.push(temp);
 return pre;
},[]);

結(jié)果如下：

不使用reduce實(shí)現(xiàn)上述需求：

groupBy(array, f) {
    let groups = {};
    array.forEach(function(o) {
        let group = JSON.stringify(f(o));
        groups[group] = groups[group] || [];
        groups[group].push(o);
    });
    return Object.keys(groups).map(function(group) {
        return groups[group];
    });
};

let sorted = this.groupBy(this.arr, function(item){
                return [item.index];   //根據(jù)對(duì)象里面的每一項(xiàng)的index分類
             });