[JS] reduce 메소드

쓰임

배열

설명

• reduce 메소드는 배열의 모든 요소를 순회하면서 주어진 함수를 실행하여 누적 결과를 하나의 값으로 줄이는 배열 메소드이다. 즉, 배열의 모든 요소에 대해 누적 작업을 실행하여 배열을 단일 값으로 변환하고 최종 결과를 반환한다.
  -> return이 존재해야 함.

• 주어진 배열을 반복하여 특정 결과를 도출한다는 점에서 forEach, map 등과 비슷하지만, reduce는 반복 시 인덱스를 포함할 수 있다는 점에서 특정한 상황에 사용이 가능하다.

구성

array.reduce((accumulator, currentValue, currentIndex, array) => {
  // logic
}, initialValue);

• accumulator: 이전 반복의 반환 값이 저장된다. initialValue가 선언되면 최초에 initailValue로 초기화된다. -> 반환할 결과
• currentValue: 현재 반복중인 배열 요소
• currentIndex: (옵션) 현재 반복중인 요소의 인덱스
• array: (옵션) reduce가 호출된 원본 배열 (array)
• initialValue: accumulator의 초기값을 지정해주는 역할을 하며, 생략할 경우 배열의 첫 번째 요소가 초기값으로 지정된다.

예시

Q) 모든 숫자의 합 구하기

const numbers = [1, 2, 3, 4, 5];

const sum = numbers.reduce((accumulator, currentValue) => {
  return accumulator + currentValue;
}, 0);

console.log(sum); // 15

활용

Q) my_string이라는 문자열을 한 줄에 m개씩 나누었을 때, 각 줄의 c번째에 해당하는 문자열을 return하는 solution함수 만들기

function solution(my_string, m, c) {
    // return [...my_string].filter((_, i) => i % m === c-1).join('');
    return [...my_string].reduce((acc, cur, i) => {
        return i % m === c - 1 ? acc + cur : acc;
    }, '');
}

최종 결과가 될 변수이자 현재 값을 저장하는 변수인 acc에, reduce문을 돌면서 조건에 맞는 경우에만 현재 반복중인 배열의 요소인 cur을 더해가는 방식으로 return문을 구성하면 원하는 결과가 도출될 수 있다.
** acc의 초기 값은 ''로 초기화 한 뒤, 반복에 들어간다.
❗ 조건에서 c - 1을 해준 이유는, 배열은 0번째부터 시작하기 때문에 1씩 줄여줘야 한다.