hello-world 2023. 3. 4. 06:21
728x90
반응형

reduce 활용

 

1. 합산

const sum = [0, 1, 2, 3].reduce((acc, cur) => acc + cur);
console.log("sum=", sum);  // sum = 6
//initVal - 이 초기값에 따라 누적값에 대한 처리가 달라진다.
//initVal - 숫자대입시 숫자 누적연산이 가능하고 배열 대입시 배열 연산처리
//initVal - 초기값이 없다면 배열의 첫번째 요소 호출
//initVal - 초기값이 설정되지 않고 배열 내부에 오브젝트로 되어 있을시엔 첫번째 오브젝트를 기준으로
// 누적연산되기에 오브젝트에 관련된 메서드등은 처리가 되지만 산술연산등은 성립되지 않으니 주의.
let initVal = 0;
let objToSum = [{ x: 1 }, { x: 2 }, { x: 3 }].reduce((acc, cur, index) => {
  return acc + cur.x;
}, initVal); 
console.log("objToSum=", objToSum); // objToSum= 6

 

2. 배열 조작 ( 평탄화 )

//중첩 1차 배열 평탄화 
let flattened = [
  [0, 1],
  [2, 3],
  [4, 5]
].reduce((acc, cur) => acc.concat(cur), []);
console.log(flattened); //[0, 1, 2, 3, 4, 5]

3.  중복 값 수치화 

let names = ["Alice", "Bob", "Tiff", "Bruce", "Alice"];
let countedNames = names.reduce((allNames, name) => {
  if (name in allNames) {
    allNames[name]++;
  } else {
    allNames[name] = 1;
  }
  return allNames;
}, {});
console.log(countedNames); //{Alice: 2, Bob: 1, Tiff: 1, Bruce: 1}

4. 객체 분류

let people = [
  { name: "Alice", age: 21 },
  { name: "Max", age: 20 },
  { name: "Jane", age: 20 }
];

function groupBy(objectArray, property) {
  return objectArray.reduce(function (acc, obj) {
    var key = obj[property];
    if (!acc[key]) {
      acc[key] = [];
    }
    acc[key].push(obj);
    return acc;
  }, {});
}

let groupedPeople = groupBy(people, "age");

console.log(groupedPeople);
/*{ 
  20: [{name: "Max", age: 20}, {name: "Jane", age: 20}],
  21: [{name: "Alice", age: 21}]
}*/

5. 중복 항목 제거 

let arr = [1, 2, 1, 2, 3, 5, 4, 5, 3, 4, 4, 4, 4];
let result = arr.sort().reduce((acc, cur) => {
  const length = acc.length;
  // acc 는 초기에는 [] 빈값 - acc 는 cur의 연산처리 및 콜백 반환값을 누적한값
  // console.log( acc, cur );
  if (length === 0 || acc[length - 1] !== cur) {
    // console.log(acc, cur);
    acc.push(cur);
  }
  return acc;
}, []);
// console.log(result); //[1,2,3,4,5]
728x90
반응형