타입 강제 변환

질문 : JS에서 this.text = 0 일 때 if( this.text == '' ) 조건에 걸리는 이유?

JavaScript에서 this.text = 0일 때 if (this.text == '') 조건이 걸리는 이유는 타입 강제 변환(Type coercion)과 관련이 있습니다.

JavaScript에서 == 비교 연산자는 비교하는 값의 타입을 변환하여 동등한지 비교합니다. 여기서 this.text = 0은 this.text에 숫자 0을 할당하는 것을 의미합니다. 이때, 0은 falsy한 값으로 간주됩니다.

비교 연산에서는 타입 강제 변환이 발생하여 비교 대상이 다른 타입일 경우 두 값을 동일한 타입으로 변환한 후 비교합니다. 따라서 '0'과 0을 비교할 때, '0'은 문자열이지만 타입 강제 변환으로 숫자로 변환되어 비교가 이루어집니다.

javascript
this.text = 0;

if (this.text == '') {
  console.log('조건이 참입니다.');
} else {
  console.log('조건이 거짓입니다.');
}

위의 코드에서 this.text에 0이 할당되었으므로 if (this.text == '')는 if (0 == '')으로 변환됩니다. 여기서 0과 빈 문자열 ''은 다른 타입이므로 타입 강제 변환이 발생하게 됩니다. 숫자 0은 falsy한 값이므로 조건은 참으로 간주되어 "조건이 참입니다."가 출력됩니다.

질문 : 그 조건에 걸리지 않게 변환하는 방법

javascript
this.text = 0;

if (this.text === '') {
  console.log('빈 문자열입니다.');
} else {
  console.log('빈 문자열이 아닙니다.');
}

this.text가 0일 때 조건에 걸리지 않도록 하려면 명시적인 비교 연산을 사용하여 값을 비교하면 됩니다. == 연산자는 타입 강제 변환이 발생하므로 이를 피하기 위해 === 연산자를 사용하면 됩니다. === 연산자는 값과 타입 모두를 비교합니다.

위의 코드에서 this.text가 0이기 때문에 타입과 값이 일치하지 않아 if (this.text === '') 조건은 거짓으로 판단됩니다. 그 결과로 "빈 문자열이 아닙니다."가 출력됩니다.

이렇게 === 연산자를 사용하면 타입 강제 변환이 일어나지 않으므로 명확한 비교가 가능합니다.