javascript type coercion (강제 형변환)

javascript에서 강제형변환 개념이 있다. 

 

다른 데이터 타입을 가지는 데이터끼리 연산(사직연산, 논리연산 등등)에 

데이터 타입을 최대한 해석해서 데이터 타입을 맞추어 연산을 수행할 때 확인할 수 있다.

 

다음과 같이 다른 타입의 데이터를 연산를 실행해보면,

console.log(10 + "hello");
console.log("" == true);
console.log(1 == true); 
console.log(10 + true); 

다음과 같은 결과가 나온다. 

10hello
false
true
11

강제 형변환이 다음과 같이 이루어짐을 알 수 있다.

• 정수 10은 문자열 hello와 + 연산시 정수형 데이터가 강제로 문자열 타입(string)으로 강제형변환이 되어 문자열이 붙은 결과가 나옴을 알 수 있다. 
• 빈 문자열과 불연산자 논리값 true를 비교 연산하면서 빈 문자열은 false로 강제현변환이 되어 false와 true를 비교하여 최종 논리값 false가 된다. 
• 정수 1과 불연산자 논리값 true를 비교하면서 정수 1은 논리값 true로 강제형변환되어 true와 true를 비교하여 최종 논리값 true가 나오게 된다. 
• 정수 10과 불연산자 논리값 true의 + 연산시 불 연산자 논리값 true는 1로 강제형변환되어 10과 1을 더하게 되어 11이 나오게 된다.

 

이때 ==는 비교하고자 하는데 예상치 못한 형변환으로 의도와 다른 결과를 낼 수 있는데 이를 위해 ==대신 ===를 사용하면 강제 형변환(type coercion)없이 비교 연산을 수행하게 된다.

 

 

다음과 같이 정수 0과 빈문자열간의 비교 연산을 ==와 ===로 나누어 실행하면,

if (0 == '') {

    console.log("True");

} else {

    console.log("False");

}



if (0 === '') {

    console.log("True");

} else {

    console.log("False");

}    

결과는 다음과 같다. 

True
False

==연산 결과는 빈문자열이 0으로 강제 형변환 되어 정수 0과 같은 값을 가지게 되므로 True 값을 반환하게 되는 반면에 === 연산 결과는 0과 빈문자열은 아예 다른 속성이므로 False를 반환하게 됨을 알 수 있다.

 

 

참고자료

exploringjs.com/deep-js/ch_type-coercion.html

Type coercion in JavaScript • Deep JavaScript

jihyehwang09.github.io/2019/04/05/33-js-type-coercion/

33 JavaScript Concepts - type coercion(강제 형 변환)