JavaScript로 첫 번째 배열 요소를 기준으로 더하기/빼기 차이 배열 만들기

문제 개요

양의 정수로 이루어진 배열을 입력받아, 각 요소를 문자열 형태의 정수로 변환한 새로운 배열을 반환하는 JavaScript 함수를 작성해야 합니다.

변환된 배열의 각 값은 첫 번째 요소에 더하거나 빼야 하는 수를 의미합니다. 즉, 첫 번째 요소를 기준으로 각 요소가 얼마나 떨어져 있는지를 부호와 함께 표현하는 것입니다.

예시

다음과 같은 배열이 주어졌을 때:

[4, 3, 6, 2]

함수는 아래와 같은 결과를 반환해야 합니다.

['+0', '-1', '+2', '-2']

첫 번째 요소 4를 기준으로 살펴보면, 4는 변화가 없으므로 +0, 3은 1을 빼야 하므로 -1, 6은 2를 더해야 하므로 +2, 2는 2를 빼야 하므로 -2가 됩니다.

구현 코드

위 문제를 해결하는 코드는 다음과 같습니다.

const arr = [4, 3, 6, 2];
const buildRelative = (arr = []) => {
  const res = [];
  let num = '';
  for(let i of arr){
    if(i - arr[0] >= 0){
      num += '+' + (i - arr[0])
    }else{
      num += i - arr[0]
    };
    res.push(num);
    num = '';
  };
  return res;
};
console.log(buildRelative(arr));

코드 동작 원리

이 코드의 작동 방식을 단계별로 살펴보겠습니다.

1. 최종 결과를 담을 빈 배열 res를 선언합니다.
2. for...of 반복문으로 배열의 모든 요소를 순회하면서, 현재 요소에서 첫 번째 요소(arr[0])를 뺀 차이를 계산합니다.
3. 차이가 0 이상이면 앞에 '+' 부호를 붙여 문자열로 만들고, 음수인 경우에는 자동으로 '-' 부호가 포함되므로 그대로 사용합니다.
4. 완성된 문자열을 res에 추가(push)한 뒤, 다음 반복을 위해 num 변수를 초기화합니다.

실행 결과

[ '+0', '-1', '+2', '-2' ]

더 간결한 대안: map() 활용하기

Array.prototype.map() 메서드를 사용하면 동일한 로직을 훨씬 간결하게 표현할 수 있습니다.

const buildRelative = (arr = []) =>
  arr.map(num => {
    const diff = num - arr[0];
    return diff >= 0 ? `+${diff}` : `${diff}`;
  });

템플릿 리터럴과 삼항 연산자를 조합하면 불필요한 변수 초기화 없이 한 줄의 변환 로직으로 처리할 수 있어 가독성과 유지보수성이 크게 향상됩니다.