자바스크립트의 모든 값은 타입이 존재한다. 타입은 개발자의 의도에 따라 다른 타입으로 변환할 수 있다.

타입 변환에는 개발자가 의도적으로 값의 타입을 변환하는 명시적 타입 변환과 자바스크립트 엔진에 의해 암묵적으로 타입이 자동 변환되는 암묵적 타입 변환 2종류가 있다.

타입 변환

명시적 타입 변환이나 암묵적 타입 변환이 기존 원시 값을 직접 변경하는 것은 아니다.

원시 값은 변경 불가능한 값 이므로 변경할 수 없다. 타입 변환이란 기존 원시 값을 사용해 다른 타입의 새로운 원시 값을 생성하는 것이다.

명시적 타입 변환

var x = 10;

// 명시적 타입 변환
// 숫자를 문자열로 변환
var str = x.toString();
console.log(typeof str, str); // string, 10

// 기존에 있던 변수 x의 값이 변경된 것은 아님!
console.log(typeof x, x); // number, 10

암묵적 타입 변환

var x = 10;

// 암묵적 타입 변환
// 문자열 연결 연산자는 숫자 타입 x의 값을 바탕으로 새로운 문자열을 생성함
var str = x + '';
console.log(typeof str, str); // string, 10

// 변수 x의 값이 변경된 것은 아님!
console.log(typeof x, x); // number, 10;

위 예제의 경우 자바스크립트 엔진은 표현식 x + ''을 평가하기 위해 x변수의 숫자 값을 바탕으로 새로운 문자열 값 '10' 을 생성하고 이것으로 표현식 '10' + ''를 평가한다. 이 때 암묵적으로 생성된 문자열 '10'은 x변수에 재할당 되지 않는다.

즉, 암묵적 타입 변환은 기존 변수 값을 재할당하여 변경하는 것이 아니다. 자바스크립트 엔진은 표현식을 에러 없이 평가하기 위해 피연산자의 값을 암묵적 타입 변환해 새로운 타입의 값을 만들어 단 한 번 사용하고 버린다.

---

명시적 타입 변환은 타입을 변경하겠다는 개발자의 의지가 코드에 명백히 드러난다.
하지만 암묵적 타입 변환은 자바스크립트 엔진에 의해 암묵적으로 일어나기 때문에 개발자의 의지가 코드에 명백히 나타나지 않는다.

따라서 자신이 작성한 코드에서 암묵적 타입 변환이 발생하는지, 발생한다면 어떤 타입의 어떤 값으로 변환되는지, 그리고 타입 변환된 값으로 표현식이 어떻게 평가될 것인지 예측 가능해야 한다.

명시적 타입 변환만 사용하면 되지 않을까? 라는 생각이 들 수 있지만, 이것은 좋은 방법이 아니다. 이유는 때로는 명시적 타입 변환보다 암묵적 타입 변환이 가독성 측면에서 더 좋을 수 도 있기 때문이다.

ex) (10).toString 보다 10 + '' 이 가독성 측면에서 좋다.

중요한 것은 코드를 예측할 수 있어야 한다는 것이다. 동료가 작성한 코드를 정확히 이해할 수 있어야 하고 자신이 작성한 코드도 동료가 쉽게 이해할 수 있어야 한다. 이를 위해 타입 변환이 어떻게 동작하는지 정확히 이해하고 사용하자!

• 참고

  모던 자바스크립트, 이웅모 저