JavaScript中的reduce方法执行过程、使用场景及进阶用法

const numbers = [1, 2, 3, 4];
const result = numbers.reduce((acc, cur, index) => {
  console.log(`累加器: ${acc}, 当前值: ${cur}, 索引: ${index}`);
  return acc + cur;
}, 0);
console.log('最终结果:', result);

const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((acc, cur) => acc + cur, 0);
console.log(sum); // 输出 15

const fruits = ['apple', 'banana', 'apple', 'orange', 'banana', 'apple'];
const count = fruits.reduce((acc, fruit) => {
  acc[fruit] = (acc[fruit] || 0) + 1;
  return acc;
}, {});
console.log(count); // { apple: 3, banana: 2, orange: 1 }

const products = [
  { name: 'Laptop', price: 1000 },
  { name: 'Phone', price: 500 },
  { name: 'Tablet', price: 300 }
];
const totalPrice = products.reduce((acc, product) => acc + product.price, 0);
console.log(totalPrice); // 输出 1800

const people = [
  { name: 'Alice', age: 25 },
  { name: 'Bob', age: 30 },
  { name: 'Charlie', age: 25 },
  { name: 'David', age: 30 }
];
const groupedByAge = people.reduce((acc, person) => {
  (acc[person.age] = acc[person.age] || []).push(person);
  return acc;
}, {});
console.log(groupedByAge);
// 输出：
// {
//   25: [{ name: 'Alice', age: 25 }, { name: 'Charlie', age: 25 }],
//   30: [{ name: 'Bob', age: 30 }, { name: 'David', age: 30 }]
// }

const orders = [
  { customer: 'Alice', total: 50 },
  { customer: 'Bob', total: 30 },
  { customer: 'Alice', total: 20 }
];
const customerTotals = orders.reduce((acc, order) => {
  acc[order.customer] = (acc[order.customer] || 0) + order.total;
  return acc;
}, {});
console.log(customerTotals); 
// 输出：{ Alice: 70, Bob: 30 }

const data = [
  { category: 'A', value: 10 },
  { category: 'B', value: 20 },
  { category: 'A', value: 15 },
  { category: 'B', value: 25 }
];
const aggregatedData = data.reduce((acc, item) => {
  acc[item.category] = (acc[item.category] || []).concat(item.value);
  return acc;
}, {});

const summedData = Object.keys(aggregatedData).reduce((acc, key) => {
  acc[key] = aggregatedData[key].reduce((sum, num) => sum + num, 0);
  return acc;
}, {});

console.log(summedData); // 输出：{ A: 25, B: 45 }

Array.prototype.myReduce = function(callback,initialValue){
    const arr = this;    // 获取调用reduce的数组
    
    if(typeof callback !== "function"){    // 验证回调函数是否传入
        throw new TypeError(`${callback} is not a function`);
    }
    
    let accumulator;    // 累加器
    let startIndex;    // 数组遍历起始位置

    if(initialValue!==undefined){    // 判断是否传递了初始值
        accumulator = initialValue;
        startIndex = 0;
    }else{
        // 如果没有提供初始值，则将第一个数组元素作为累加器的初始值
        if(arr.length===0){
            throw new TypeError(`Reduce of empty array with on initial value`);
        }
        accumulator = arr[0];
        startIndex = 1;
    }
    // 遍历数组并应用回调函数
    for(let i=startIndex;i<arr.length;i++){
        accumulator = callback(accumulator,arr[i],i,arr);
    }
    // 返回累加结果
    return accumulator
}

const numbers = [1,2,3,4,5];
const sum = numbers.myReduce((acc,curr)=>acc+curr,0)   // 15
const product = numbers.myReduce((acc,curr)=>acc*curr)   // 120