reduce는 왜 필요할까? (feat: rest parameters)

우선 최고의 참고 사이트 MDN 링크

(1)Reduce : https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce

Array.prototype.reduce() - JavaScript | MDN

(2)Rest parameters : https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Functions/rest_parameters

Rest 파라미터 - JavaScript | MDN

 

입력받은 인자를 문자, 숫자 구분 없이 전부 더해주는 함수를 만들고 싶다.

1) 숫자를 넣는다고 하면  :  sum(1,2,3)을 넣었을땐 6이 출력되야 하고
2) 문자를 넣는다고 하면 : sum('Hello','World')를 넣었을땐 HelloWorld가 출력되야한다
3) 숫자,문자 등 혼용한다면 : sum('Hello',1,2,3)을 넣었을땐 Hello123이 출력될 것이다

rest parameter를 사용하여 reduce 없이 짠다고 하면 이렇게 된다

function old_sum(...args){
    let sum;
    for(let i=0; i<args.length; i++){
        if(i==0){
            if(typeof(args[i]) == 'number'){
                sum = 0;
            }else{
                sum = "";
            }
        }
        sum += args[i];
    }
    return sum;
}
 
console.log('for문(숫자만) : ', old_sum(1,2,3)); //6
console.log('for문(문자만) : ', old_sum('Hello',' World')); //Hello World
console.log('for문(숫자 + 문자) : ', old_sum(1,2,3,' Hello',' World')); //6 Hello World
console.log('for문(문자 + 숫자) : ', old_sum('Hello ',1,2,3)); //Hello 123

 

그치만 reduce를 쓰면 단 한줄로 쌉가능해진다

function sum(red,...args){
    return args.reduce((prev, curr) => { return prev + curr}, red);
}
 
console.log('reduce(숫자, 초기값 0) : ',sum(0,1,2,3)); //6
console.log('reduce(숫자, 초기값 100) : ',sum(100,1,2,3)); //106
console.log('reduce(문자, 초기값 Hello) : ',sum('Hello ','w','o','r','l','d')); //Hello World
console.log('reduce(숫자 + 문자, 초기값 0) : ',sum(0,1,2,3,' Hello', ' World')); //6 Hello World
console.log('reduce(문자, 초기값 0) : ',sum(' Hello', ' World')); //0 Hello World
console.log('reduce(문자 + 숫자, 초기값 Hello) : ',sum('Hello ',1,2,3)); //Hello 123