Front-endJavaScript

덧셈 연산과 문자열 변환

⏱ 읽기 소요 시간: 4 분

덧셈 연산과 문자열 변환 과정에서 무의식적으로 코딩하다가 일어난 이슈와 그 해결 방법에 대해 정리하고자 한다.

  • Number 타입의 값들을 이어 붙여서 문자열로 변환하고자 했다.
1
2
3
const yyyy = 2019;
const mm = 04;
const dd = 15;
  • yyyy, mm, dd 각 변수에는 Number 타입의 값이 각각 들어있다.
  • 이 값들을 문자열인 '20190415'로 변환하고자 한다.
  • 처음 작성한 코드는 아래와 같다.
1
2
3
let today = "";
today = String(yyyy + mm + dd);
console.log(today); //'2038'

  • 먼저 각 변수에 담긴 숫자들의 덧셈 연산이 이루어진 후, String을 통해 문자열로 변환이 이루어진다. 따라서 의도와는 달리 '2038'이라는 결과가 나온다.

  • 해당 이슈는 크게 2가지 방법으로 해결할 수 있다.

대처 방안

1. 각각을 문자열로 바꾼 후, 덧셈 연산(+)을 통해 이어 붙여준다.

1
2
today = String(yyyy) + String(mm) + String(dd);
console.log(today); //'20190415'

2. 덧셈 연산(+) 사이에 빈 문자열(‘’)을 추가하여 숫자를 문자열로 변환해 준다.

1
2
today = yyyy + "" + mm + "" + dd;
console.log(today); //'20190415'
  • 중요한 포인트는 문자열 변환과 덧셈 연산의 순서이다.
    덧셈 연산 후, 문자열로 변환하는 것이 아니라
    문자열 변환 후, 덧셈 연산이 일어나야 위의 목적에 원하는 결과를 얻을 수 있다.
Share