JavaScript로 메서드 체이닝이 가능한 Streak 계산 클래스 만들기

문제 상황

JavaScript에서 사용자 정의 데이터 타입 Streak를 만들어야 합니다. 이 클래스는 값(value)과 연산(operation)을 번갈아 가며 원하는 만큼 무한히 체이닝(chaining)할 수 있어야 합니다.

사용할 수 있는 값은 다음 문자열 중 하나입니다.

→ one, two, three, four, five, six, seven, eight, nine

사용할 수 있는 연산은 다음 문자열 중 하나입니다.

→ plus, minus

예를 들어, 우리가 만든 클래스를 다음과 같이 사용한다면,

Streak.one.plus.five.minus.three;

출력 결과는 아래와 같아야 합니다.

const output = 3;

출력 결과 해설

실제로 수행된 연산은 다음과 같습니다.

1 + 5 - 3 = 3

구현 원리

핵심 아이디어는 Object.defineProperty를 활용해 getter 속성을 정의하는 것입니다. 숫자 이름(one, two 등)에 접근하는 순간 getter가 실행되어 내부 값을 설정하고, 연산자(plus, minus)는 Number.prototype에 객체 형태로 추가되어 체이닝을 이어갈 수 있게 됩니다.

예제 코드

다음은 전체 구현 코드입니다.

const Streak = function() {
    let value = 0;
    const operators = {
        'plus': (a, b) => a + b,
        'minus': (a, b) => a - b
    };
    const numbers = [
        'zero', 'one', 'two', 'three', 'four', 'five',
        'six', 'seven', 'eight', 'nine'
    ];
    Object.keys(operators).forEach((operator) => {
        const operatorFunction = operators[operator];
        const operatorObject = {};
        numbers.forEach((num, index) => {
            Object.defineProperty(operatorObject, num, {
                get: () => value = operatorFunction(value, index)
            });
        });
        Number.prototype[operator] = operatorObject;
    });
    numbers.forEach((num, index) => {
        Object.defineProperty(this, num, {
            get: () => {
                value = index;
                return Number(index);
            }  
        });
    });
};
const streak = new Streak();
console.log(streak.one.plus.five.minus.three);

실행 결과

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

3