JavaScript 동등 연산자와 일치 연산자

JavaScript 동등 연산자와 일치 연산자

 

JavaScript에서 비교 연산자는 피연산자를 비교하여 boolean 값을 반환합니다. 비교 연산자의 동등 연산자와 일치 연산자가 피연산자 값의 일치 여부를 판별합니다. 동등 연산자와 일치 연산자는 모두 값의 일치 여부를 판별하지만 그 기준에서 차이가 있습니다.  

 

 

1. 동등 연산자

---

동등 연산자(==, abstract equality)로 피연산자를 비교할 때는 JavaScript 엔진에 의해 암묵적인 타입 변환이 먼저 이루어집니다. 따라서 좌항과 우항의 타입이 다르더라도 값이 같다면 true를 반환합니다.

 

let a = 10;
let b = '10';
 
console.log(a == b);    // true

 

동등 연산자를 사용하면 편리한 경우도 있지만 타입을 변환하여 비교하는 과정에서 의도치 않은 방식으로 동작하여 다음과 같은 결과가 나타나기도 합니다. 이러한 경우엔 동등 연산자 대신에 일치 연산자를 사용해주면 됩니다.

 

console.log('' == '0');    // false
console.log('' == 0);    // true
console.log('0' == 0);    // true
 
console.log('false' == false);    // false
console.log('0' == false);    // true
console.log(0 == false);    // true
 
console.log(null == undefined);    // true
console.log(null == false);    // false
console.log(undefined == false);    // false

 

하지만 null check를 하는 경우엔 동등 연산자를 유용하게 사용할 수 있습니다. 동등 연산자는 null 과 undefined 두 값을 동일하게 취급하고, 두 값을 제외한 다른 값들에 대해서는 항상 false를 반환합니다.

 

let val1 = null;
let val2 = undefined;
 
if (val1 == null && val1 == undefined) {
    console.log('val1 is null and undefined');
}
 
if (val2 == null && val2 == undefined) {
    console.log('val2 is null and undefined');
}
 
console.log(null == undefined);   // true
 
console.log(null == false); // false
console.log(null == 0); // false
console.log(null == '');  // false
 
console.log(undefined == false);  // false
console.log(undefined == 0);  // false
console.log(undefined == '');  // false

 

 

2. 일치 연산자

---

일치 연산자(===, strict equality)는 좌항과 우항의 피연산자가 값과 타입이 모두 같은 경우에만 true를 반환합니다.

 

let a = 10;
let b = '10';
let c = 10;
 
console.log(a == b);  // true
console.log(a === b); // false
console.log(a === c); // true

 

다만, 다음과 같이 NaN과 0의 경우에는 다르게 동작합니다.

 

유효하지 않은 숫자를 나타내는 값인 NaN(Not a Number)은 자신과 일치하지 않는 유일한 값이기 때문에 일치 연산자로 비교해도 false가 반환됩니다. 따라서 NaN 여부를 판별하려면 isNaN() 내장 함수를 사용해야 합니다. 

 

console.log(NaN === NaN);  // false
console.log(isNaN(NaN)); // true

 

또한 0과 -0은 다른 값이지만 일치 연산자는 같은 값으로 취급합니다.

 

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

 

 

3. Object.is()

---

Object 내장 객체의 is() 메서드는 파라미터로 주어진 두 값의 일치 여부를 확인하여 boolean 값을 반환합니다. is() 메서드는 내부적으로 다음의 과정을 거쳐서 일치 여부를 확인합니다.

 

• 두 값 모두 undefined
• 두 값 모두 null
• 두 값 모두 true 또는 false
• 두 값 모두 같은 문자열
• 두 값 모두 같은 객체
• 두 값 모두 숫자
  - 둘 다 같은 값
  - 둘 다 +0
  - 둘 다 -0
  - 둘 다 NaN

is() 메서드의 두 값을 비교하는 동작은 앞서 알아본 일치 연산자와 동일하지만 NaN과 0의 경우에는 다음과 같은 차이를 보입니다.

 

console.log(Object.is(NaN, NaN)); // true
console.log(Object.is(0, -0)); // false

 

이상으로 JavaScript의 동등 연산자와 일치 연산자에 대해 알아봤습니다.

 

 

※ Reference

 

• poiemaweb.com, , https://poiemaweb.com/js-operator
• helloworldjavascript.net, 연산자 더 알아보기, https://helloworldjavascript.net/pages/245-operator-in-depth.html
• developer.mozilla.org, Object.is(), https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Object/is