알고리즘 문제를 풀기 위해 배열의 합을 구해야 했다.
기존에는 배열의 합을 구하기 위하여 for문이나 forEach()를 사용했었다.
그런데 검색도중 .reduce()를 유용하게 많이 사용한다고 하여 나도 한번 알아보았다.
Array.reduce() 기본 사용법
// 배열.reduce((누적값, 현재값, 인덱스, 요소) => { return 결과 }, 초깃값);
// 배열.reduce((accumulator, currentValue, index) => { return 결과 }, 초깃값);
const array = [ 6, 2, 1, 8, 10 ]
const result = array.reduce((accumulator, currentValue, index, arr) => {
console.log(accumulator, currentValue, index);
return acc + cur;
}, 0);
// 0 6 0
// 6 2 1
// 8 1 2
// 9 8 3
// 17 10 4
result; // 27
//초기값을 적어주지 않았을 떄!
const result = array .reduce((acc, cur, index) => {
console.log(acc, cur, index);
return acc + cur;
});
// 6 2 1
// 8 1 2
// 9 8 3
// 17 10 4
result; // 27이렇게 풀어놓기만 하면 무슨말인지 잘 이해가 안될 수 있다.
accumulator 누적값, currentValue 현재값, index는 인덱스, arr은 요소 이다.
반복문처럼 한번씩 돌아가면서 값을 더해준다고 생각하면 된다.
초기값을 0으로 셋팅해 주었으니 누적값은 0, 배열에 처음에 있는 값 현재값 6, 그리고 인덱스는 0,
그 다음 단계에서는 누적값은 6, 현재값은 두번째 요소인 2, 인덱스는 1, 이런식으로 차근차근 돌아가는 것이다.
내가 알기로 reduce는 중간에 도망쳐 나올수가 없다고 한다. 주의 요망!
화살표함수를 이용한 reduce()사용법
//arrow function 이용하기
const array = [ 6, 2, 1, 8, 10 ];
const result = array.reduce((acc,cur)=> acc + cur );
console.log(result); // 27
Object에서 사용하기
var array = [
{ name: "Heina", age: 25 },
{ name: "Claire", age: 60 },
{ name: "Patrick", age: 30 },
{ name: "Teo", age: 20 },
];
const result = array.reduce((acc, cur) => acc + cur.age); //err여기선 결과가 나오지 않는다 이유는 초기값을 설정하지 않았기 때문!
const result = array.reduce((acc, cur) => acc + cur.age, 0); //135
const result = array.reduce((acc, cur) => acc + cur.age, 10); //145
//평균값을 구하려면
console.log(result / array.length); //33.75콜백으로 reduce()사용하기
function reducer(acc, cur, index){
const result = acc + cur;
console.log('acc = ', acc, 'cur = ', cur , 'index = ', index , 'result = ',result)
return result
}
return array.reduce(reducer, 0);rudece() 를 이용하여 filter 기능도 사용할 수 있다고 하였는데, 그건 추가로 공부한 후 내용을 추가시킬 예정이다.
array 메소드 함수에 대한 재밌는 짤방 ㅎ
