[JavaScript] reduce 함수

Javascript

 

const number = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

const val = 0;

const total = number.reduce((val1, val2, idx, arr) => {
  return val1 + val2;
}, val);

console.log(total);

 

reduce()

val1 : reduce() 함수의 두번째 파라미터 val의 값이 들어온다.
val2 : number 배열의 첫번째 데이터 ' 1 ' 이 들어온다.
idx : reduce() 함수의 두번째 파라미터인 val(두번째 파라미터)을 사용했는지의 여부(파라미터가 있는지 없는지)에 따라 값이 달라진다.
        val을 사용했다면 0부터 시작하고, 사용하지 않았다면 1부터 시작한다.
arr : reduce() 함수가 호출된 배열, number배열을 리턴한다.

 

 

const total = number.reduce((val1, val2, idx, arr) => {
  console.log(`val1 : ${val1}, val2 : ${val2}, idx: ${idx}, arr: ${arr}`);
  return val1 + val2;
}, val);

 

val1, val2, idx, arr의 값이 어떻게 되는지 알아보기 위해 console창에 찍어보았다.

첫줄 val1은 val 상수의 값인 0이 들어가고, val2 에는 number배열의 첫번째 데이터인 1이 들어가고,
idx는 val(두번째 파라미터)를 사용했으므로 0이 들어가고, arr는 number배열의 데이터들을 리턴한다.

그러면서 val1 + val2로 리턴(return)을 하였으므로 값이 계속 더해지면서 최종적으로 55 라는 값을 출력한다.