본문 바로가기
JavaScript

[JavaScript] - 타입 변환 (명시적 형변환 vs 암시적 형변환)

by 개발 고양이 2025. 2. 25.

자바스크립트는 동적 타입 (dynamic type) 언어로, 변수의 타입이 실행 도중에 유연하게 변할 수 있다. 

오늘 포스팅에서는 자바스크립트의 타입 변환 방식에 대해 포스팅해보도록 하겠다.

 

자바스크립트에서 타입 변환은 크게 2가지로 나뉜다.

1. 암시적 변환(implicit conversion) : 자동으로 타입이 변환됨

2. 명시적 변환(explicit conversion) : 개발자가 의도적으로 타입을 변환시킴 (ex. String(), Boolean())


암시적 타입 변환 (Implicit Conversion)

암시적 타입 변환은, 자바스크립트 엔진이 코드 문맥에 따라 자동으로 타입을 바꿔주는 경우를 말한다.

알맞게 변환해줬을 경우 코드가 간결해지고 개발자 입장에서도 편리하지만, 의도치 않게 다른 결과가 나올 수 있으며, 코드가 길어질수록 코드 분석이 어려워진다는 단점이 있다.

//문자열로 변환
console.log('10' + 1) // "101"
console.log('10' + true); // "10true"

let num = 123;
let str = num + "" // "123"

문자열로 변환하는 가장 간단한 방법은 덧셈 연산자를 사용하여 " "를 더해주는 것이다.

//숫자형으로 변환
console.log('10' - '5') // 5
console.log('10' + 5) // 15
//동등 연산자(==)
console.log('0' == 0); // true
console.log(1 == true); // true
console.log('0' == false) // true

 

주의사항

조건문 안의 값은 자동으로 boolean 타입으로 변환된다.

const a = "";
if (a) {
  console.log("a");// 실행되지 않음. (""는 false 값)
}

const b = "1";
if (b) {
  console.log("b");// 실행됨 ("1"은 true 값)
}

실행 결과 b만 출력된 것을 확인할 수 있다.


명시적 타입 변환 (Explicit Conversion)

명시적 타입 변환은 특정 타입을 개발자가 명시하는 방식이다. (일반적으로 암시적 타입 변환보다 명시적 타입 변환 방식이 더 권장된다.) 암시적 타입 변환에 비해 코드 길이는 늘어나지만, 코드가 명확해지기 때문에 디버깅 및 유지보수가 쉽다는 장점이 있다.

// 다른 타입 -> 숫자형 변환
let str1 = "123";
let num1 = Number(str1);  // num1은 123(숫자형으로 변환됨)

 

// 다른 타입 -> 문자열 변환
let num2 = 456;
let str2 = String(num2);  // str2은 "456" (문자열로 변환됨)
let str = num + "";  // 숫자 num을 문자열로 변환

 

// boolean으로 변환
let value = 0;
let boolValue = Boolean(value);  // false

 

 

참고

변환이 불가능한 경우, NaN이 반환된다!