[JS] 일치 연산자 '==='에 대해 알아보자

들어가며

자바스크립트에는 두 값이 같은 지를 비교하는 일치 연산자 '==='가 있습니다. 이번 시간에는 이 연산자가 무엇이고, 어떻게 비교를 수행하는지 알아보도록 하겠습니다.

 

일치 연산자 '==='

일치 연산자(strict equality)는 두 피연산자가 동일한지 비교한 후, boolean 결과를 반환합니다. 다만, 동등 연산자(equality) '=='와 달리 다른 타입의 값은 다른 것으로 간주합니다.

 

일치 연산자(===와 !==)는 IsStrictlyEqual semantic을 제공합니다.

 

비교 규칙은 아래와 같습니다.

• 같은 타입일 경우
  • Object(객체): 두 피연산자가 같은 객체를 참조할 때만 true를 반환합니다.
  • String(문자열): 두 피연산자가 동일한 문자를 동일한 순서로 가질 때만 true를 반환합니다.
  • Number(숫자): 두 피연산자의 값이 같을 때만 true를 반환합니다. (+0과 -0은 같은 걸로 간주합니다. 둘 중 하나가 NaN인 경우, 항상 false를 반환합니다; NaN은 NaN과 절대 같지 않습니다.)
  • Boolean(부울): 두 피연산자의 값이 모두 true 또는 모두 false일 때만 true를 반환합니다.
  • BigInt: 두 피연산자의 값이 같을 때만 true를 반환합니다.
  • Symbol(심볼): 두 피연산자가 동일한 심볼을 참조할 때만 true를 반환합니다.
• 다른 타입일 경우, false를 반환합니다.
  
  • null과 undefined는 다른 값으로 간주됩니다.
    두 피연산자 모두 null 또는 모두 undefined일 경우, true를 반환합니다.
  • 부울 값은 숫자로 변환되지 않습니다.

 

같은 타입 비교

"hello" === "hello"; // true
"hello" === "hola"; // false

3 === 3; // true
3 === 4; // false

true === true; // true
true === false; // false

null === null; // true

 

다른 타입 비교

1 === "1"; // false
0 === false; // false
null === undefined; // false
3 === new Number(3); // false

 

객체 비교

const object1 = {
  key: "value",
};

const object2 = {
  key: "value",
};

console.log(object1 === object2); // false
console.log(object1 === object1); // true

 

마치며

일치 연산자 '==='는 자바스크립트에서 두 값을 비교해 주는 연산자입니다. 동등 연산자 '=='와 달리 비교 시 타입 변환이 일어나지 않기 때문에, 더 안전하게 사용 가능합니다.

 

피드백이나 의견은 언제나 환영합니다 :D

감사합니다.

 

See also

[JS] 동등 연산자 '=='에 대해 알아보자

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Equality

 

References

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Strict_equality

https://en.wikipedia.org/wiki/Relational_operator