자바스크립트에서 값을 비교하는 경우 == 또는 === 을 사용해 값을 비교합니다.
비교 연산자인 == 와 === 의 차이점에 대해서 알아보려고 합니다.
이미 알고 계신 내용이라면 끝가지 읽지 않으셔도 괜찮습니다.
그리고 Object.is 대해서도 살펴보도록 하겠습니다.
== 와 === 차이
먼저 비교 연산자 == 와 === 에 대해서 살펴보겠습니다.
자바스크립트를 공부하면서 값을 비교하기 위해 사용하는 연산자로 ==를 배우게 됩니다.
하지만 == 보다는 ===를 사용하는 경우가 더욱 많습니다.
이유는 ==에는 형변환 기능이 암묵적으로 발생하기 때문입니다.
숫자와 문자열의 값을 비교하는 경우 양쪽 모두 문자열로 변환해서 비교를 합니다.
그리고 원시 타입(primitive type)과 오브젝트를 비교할 때에는 오브젝트가 원시 타입(primitive type)으로 변환됩니다.
원시 타입이란 숫자나 문자열 등 오브젝트 외의 값을 말합니다.
== 와 === 차이 예제
console.log(3 == "3"); // true ("3"을 3으로 변환)
console.log(1000 == "1e3"); // true ("1e3"을 1000으로 변환)
console.log(3 === "3"); // false (형변환 하지 않음)
console.log(1000 === "1e3"); // false (형변환 하지 않음)
예제에서 볼 수 있듯이 ==는 형변환을 하기 때문에 사용빈도가 적습니다.
null 값을 비교할 때는 자주 사용합니다.
==는 null과 undefined을 동일하게 다루기 때문에 == null를 사용해서 비교하면 null 또는 undefined 이란 의미로 비교를 해줍니다.
비교 연산자도 기본적으로 값이 같은지 비교를 하지만 형변환은 하지 않습니다.
즉 비교하려는 값과 데이터 타입 모두 일치하는지 비교합니다.
Object.is
ES2015에서 추가 된 함수로 값을 비교해줍니다.
기본적인 동작은 ===와 같습니다.
다른 점이라고 하면 다음 2가지가 있습니다.
・NaN 과 NaN 비교 결과가 true
・+0과 -0 비교 결과가 false
Object.is 예제
// NaN 비교 결과
console.log(Object.is(NaN, NaN)); // true
console.log(NaN === NaN); // false
// +0과 -0 비교 결과
console.log(Object.is(+0, -0)); // false
console.log(+0 === -0); // true
위 2가지를 제외하고는 ===와 Object.is는 같은 결과를 얻을 수 있습니다.
JavaScript 비교 연산자인 ==와 ===의 차이점과 비교 함수인 Object.is에 대한 설명을 마치도록 하겠습니다.
댓글