연산자03 - 비교 연산자

"연산자"

3. 비교 연산자

비교 연산자(Comparison Operator)는 좌항과 우항의 피연산자를 비교한 다음 그 결과를 불리언 값으로 반환한다. 이 비교 연산자로 이루어진 표현식을 조건식이라고 이야기 하기도 함. 이 조건식은 if문이나 for 문과 같은 제어문에서 주로 사용한다.

 

3.1. 동등 / 일치 비교 연산자

동등 비교(loose equality) 연산자와 일치 비교(strict equality) 연산자는 좌항과 우항의 피연산자가 같은 값을 갖는지 비교하여 불리언 값을 반환한다. 하지만 비교하는 엄격성의 정도가 다르다. 동등 비교 연산자는 느슨한 비교를 하지만 일치 비교 연산자는 엄격한 비교를 한다.

// 동등 비교
5 == 5; // -> true

// 타입은 다르지만 암묵적 타입 변환을 통해 타입을 일치시키면 동등하다.
5 == '5'; // -> true

결론 -> 동등비교 연산자는 편리한 경우도 있지만 결과를 예측하기 어렵기 때문에 사용하지 않는 것이 좋다.

// 동등 비교. 결과를 예측하기 어렵다.
'0' == ''; // -> false
0 == ''; // -> true
0 == '0'; // -> true
false == 'false'; // -> false
false == '0'; // -> true
false == null; // -> false
false == undefined; // -> false

 

일치 비교(==) 연산자는 좌항과 우항의 피연산자가 타입도 같고 값도 같은 경우에 한하여 true를 반환한다. 다시 말해 암묵적 타입 변환을 하지 않고 값을 비교한다.

// 일치 비교
5 === 5; // -> true

// 암묵적 타입 변환을 하지 않고 값을 비교한다.
// 즉, 값과 타입이 모두 같은 경우만 true를 반환한다.
5 === '5'; // -> false

일치 비교 연산자는 예측하기 쉽다. 위에 살펴본 동등 비교 연산자의 그지같은 예제는 모두 false를 반환한다.

일치 비교 연산자에서 주의할 것은 NaN이다.

// NaN은 자신과 일치하지 않는 유일한 값이다.
NaN === NaN; // -> false

NaN은 자신과 일치하지 않는 유일한 값이다. 따라서 숫자가 NaN인지 조사하려면 빌트인 함수 isNaN을 사용한다.

// 빌트인 함수 isNaN은 주어진 값이 NaN인지 체크하고 그 결과를 반환한다.
isNaN(NaN); // -> true
isNaN(10); // -> false
isNaN(1 + undefined); // -> true

숫자 0도 주의하도록 하자. 자바스크립트에는 양의 0과 음의 0이 있는데 이들을 비교하면 true를 반환한다.

// 양의 0과 음의 0의 비교. 일치 비교/동등 비교 모두 true이다.
0 === -0; // -> true
0 === -0; // -> true

Object.is 메소드
위에서 살펴본 바와 같이 동등 비교 연산자(==)와 일치 비교 연산자(===)는 +0과 -0을 동일하다고 평가한다. 또한 동일한 값인 NaN과 NaN을 비교하면 다른 값이라고 평가한다.
ES6에서 새롭게 도입된 Object.is 메소드는 아래와 같이 예측 가능한 정확한 비교 결과를 반환한다. 그 외에는 일치 비교 연산자(===)와 동일하게 동작한다.

-0 === +0; // -> true
Object.is)-0, +0); // -> fale

NaN === NaN; // -> false
Object.is(NaN, NaN); // -> true

부동등 비교 연산자(!=)와 불일치 비교 연산자(!==)는 동등 비교(==) 연샂나와 일치비교(===) 연산자의 반대 개념이다.

// 부동등 비교
5 != 8; // -> true
5 != 5; // -> false
5 != '5'; // -> false

// 불일치 비교
5 !== 8; // -> true
5 !== 5; // -> false
5 !== '5'; // -> true

 

3.2. 대소 관계 비교 연산자

대소 관계 비교 연산자는 피연산자의 크기를 비료하여 불리언 값을 반환한다.

// 대소 관계 비교
5 > 0; // -> true
5 > 5; // -> false
5 >= 5; // -> true
5 <= 5; // -> true