Reduce 뽀개기!

배열 공부하면서 진짜 안쓰는 reduce, map...
이참에 다시 공부해보잣...! 👩🏻‍💻

reduce란?

reduce는 배열의 각 요소에 대한 callback함수를 실행한 뒤 하나의 결과 값을 리턴한다.

reduce와 map의 차이

reduce : 하나의 결과 값을 반환
map : 배열의 형태로 결과 값 반환

reduce의 형태

reduce((acc, cur)=> acc + cur)

• acc : 누적되고 최종적으로 출력되는 값
• cur : 현재 돌고 있는 요소로 순서대로 들어간다.

예를 살펴보자

const numbers = [1, 2, 3, 4];
let sum = numbers.reduce((acc, cur) => {
	return acc + cur;
});

console.log(sum); // 10

이게 어떻게 작동되냐면
acc는 계속해서 누적되는 값이란걸 무조건 기억하는게 좋다.
1. 1(acc) + 2(cur) = 3
2. 3(acc) + 3(cur) = 6
3. 6(acc) + 4(cur) = 10(acc)

reduce를 이용해서 최대값, 최소값 구하기

최대값

const arrs = [100, 2, 15, 244, 1, 600, 4];

function solution(){
	let results = 0;
    return results = arrs.reduce((acc, cur)=> acc > cur ? acc : cur);
}
solution(); // 600

사실 이 문제는 나는 Math.max로 풀었는데 reduce가 더 빠른걸까?

const arr = [100, 2, 15, 244, 1, 600, 4];

function solution2() {
	return Math.max(...arr);
}
solution2(); // 600

최소값

const arr = [100, 2, 15, 244, 1, 600, 4];

function solution2() {
  return arr.reduce((acc, cur) => acc < cur ? acc : cur);
}
solution2(); // 1

이것도 Math.min으로 풀 수 있다.

const arr = [100, 2, 15, 244, 1, 600, 4];

function solution2() {
  return Math.min(...arr);
}
solution2(); // 1

알파벳 개수 구하기

const alphabets = ["a", "a", "b", "c","c","c"];
function result() {
	return alphabets.reduce((prev, cur) => {
    	prev[cur] = (prev[cur] || 0 ) +1;
        return prev;
    }, {});
};
result(); // {"a": 2, "b": 1, "c": 3}