JavaScript로 범용 계산기 함수 만들기: 사칙연산을 한 번에 처리하는 방법

개요

이번 글에서는 JavaScript로 calculator() 함수를 작성해 보겠습니다. 이 함수는 첫 번째 인수로 네 가지 연산자 문자(+, -, *, /) 중 하나를 받고, 그 뒤로 임의 개수의 숫자 리터럴을 전달받습니다. 함수의 역할은 첫 번째 인수로 지정된 연산을 나머지 숫자들 전체에 적용한 결과를 반환하는 것입니다.

연산이 덧셈(+)이나 곱셈(*)이라면 모든 요소에 동일한 연산을 순서대로 수행하면 됩니다. 하지만 연산이 뺄셈(-)이나 나눗셈(/)이라면 첫 번째 요소를 기준값으로 삼아, 나머지 모든 요소를 기준값에서 빼거나 기준값을 나머지 요소들로 나누어야 한다는 점이 핵심입니다.

그럼 이 함수의 코드를 작성해 보겠습니다.

예제

const calculator = (operation, ...numbers) => {
    const legend = '+-*/';
    const ind = legend.indexOf(operation);
    return numbers.reduce((acc, val) => {
        switch(operation){
            case '+': return acc+val;
            case '-': return acc-val;
            case '*': return acc*val;
            case '/': return acc/val;
        };
    });
};
console.log(calculator('+', 12, 45, 21, 12, 6));
console.log(calculator('-', 89, 45, 21, 12, 6));
console.log(calculator('*', 12, 45, 21, 12, 6));
console.log(calculator('/', 189000, 45, 7, 12, 4));

실행 결과

콘솔에 출력되는 결과는 다음과 같습니다.

96
5
816480
12.5

코드 설명

이 함수는 나머지 매개변수(rest parameter) 문법(...numbers)을 활용해 첫 번째 인수를 제외한 모든 숫자를 하나의 배열로 받습니다. 이후 Array.prototype.reduce() 메서드로 배열의 각 요소를 순회하면서 switch 문을 통해 지정된 연산을 누적 적용합니다.

덧셈과 곱셈은 교환 법칙이 성립하기 때문에 인수의 순서와 무관하게 같은 결과를 얻습니다. 반면 뺄셈과 나눗셈은 첫 번째 숫자가 기준값 역할을 하므로, 인수를 전달하는 순서에 따라 결과가 달라진다는 점에 유의해야 합니다.