본문 바로가기
JAVA

[JS] 자바스크립트 == 연산자 사용 주의할점

by code:J 2023. 8. 11.
반응형
SMALL
JavaScript에서 == 연산자를 사용하여 동등 비교를 수행할 때는 값의 형태가 서로 다른 경우
자동으로 형변환이 일어나게 되고, 그 후에 값을 비교합니다.

JavaScript에서 == 연산자는 동등 비교(Equal Comparison)를 수행합니다.

== 연산자를 사용할 때, 피연산자의 타입이 서로 다를 경우,

자동으로 형변환을 시도하여 두 값이 다를 경우 자동으로 형변환을 시도하여 두 값이 같은지 비교합니다.

 

때문에 이러한 형변환 규칙들로 인해 몇 가지 특이한 결과를 나타낼 수 있습니다.

 

== 연산

 

 

1. 숫자와 문자열 비교

console.log(5 == '5'); // true

숫자 5와 문자열 '5'를 비교할 때는, JavaScript에서는 문자열 '5'를 숫자 5로 형변환하여 비교합니다.
따라서 결과가 true가 됩니다.

 

2. Boolean과 숫자 비교

console.log(true == 1); // true
console.log(false == 0); // true

불리언 값 true와 false는 각각 숫자 1과 0으로 자동 형변환됩니다.

따라서 결과는 모두 true 가 됩니다.

 

console.log(true == 1); // true
console.log(false == 0); // true

 

3. 빈 문자열과 숫자 0 비교

console.log('' == 0); // true

빈 문자열 ''은 숫자 0으로 형변환 됩니다.

따라서 결과는 true 가 됩니다.

 

3. 빈 배열과 숫자 0 비교

console.log([] == 0); // true

빈 배열 [] 은 빈 문자열 ''로 형변환되고, '' 이 빈 문자열은 숫자 0으로 형변환 됩니다.

따라서 결과는 true 가 됩니다.

 

4. [0]인 배열과 숫자 0 비교

let a = [0];
let b = 0;
console.log(a == b); // 출력: true

위에서 빈배열은 0과 == 비교했을 때 true가 나왔습니다.

하지만 배열에 0이 들어가 있는 것으로, 빈 배열이 아니지만 true가 나옵니다.

 

이 이유는 JavaScript에서는 배열을 문자로 변환한 후 숫자로 변환하여 비교하기 때문입니다.

 

따라서 a 배열은 [0]로, 문자열 '0'으로 변환됩니다.

따라서 값이 동등하다고 판단하여 결과는 true 가 됩니다.

5. Null과 Undefined 비교

console.log(null == undefined); // true

null과 undefined는 == 연산에서만 같다고 취급되며,

다른 값과 비교 시에는 false가 됩니다.

6. 객체와 숫자 비교

console.log({} == 0); // false

객체와 숫자는 당연히 동등하지 않기 때문에 

false가 됩니다.

 

요약

이러한 형변환과 규칙들로 인해 == 연산자는 예상치 못한 결과를 낼 수 있습니다. 

이러한 혼동을 피하려면 일반적으로 엄격한 === 연산자(일치 비교)를 사용하여 값과 타입을 모두 비교하는 것이 좋습니다.

반응형
LIST