자바스크립트 기본 - 비교 연산자

불린형 반환

• true 가 반환되면, 긍정, 참, 사실을 의미
• false 가 반환되면, 부정, 거짓, 사실이 아님을 의미
• 반환된 불린값은 다른 값처럼 변수에 할당할 수 있다.

문자열 비교

자바스크립트는 사전순(정확히는 유니코드 순)으로 문자열을 비교한다. 이 기준을 적용하면 사전 뒤쪽의 문자열은 사전 앞쪽의 문자열보다 크다고 판단된다. 문자열을 구성하는 문자 하나하나를 비교해가며 문자열을 비교한다.

문자열 비교 시 적용되는 알고리즘은 다음과 같다.

1. 두 문자열의 첫 글자를 비교
2. 첫 번째 문자열의 첫글자가 다른 문자열의 첫 글자보다 크면, 첫번째 문자열이 두 번째 문자열보다 크다고 결론내고 비교를 종료
3. 두 문자열의 첫 글자가 같으면 두 번째 글자를 같은 방식으로 비교
4. 글자 간 비교가 끝날 때까지 과정을 반복
5. 비교가 종료되었을 때
   1. 비교가 종료되었고 문자열의 길이도 같다면 두 문자열은 동등하다고 결론
   2. 비교가 종료되었지만 두 문자열의 길이가 다르면 길이가 긴 문자열이 더 크다고 결론

다른 형을 가진 값 간의 비교

비교하려는 값의 자료형이 다르면 자바스크립트는 이 값들을 숫자형으로 바꾼다.

• ‘2’ → 숫자 2로 변환
• ‘01’ → 숫자 1로 변환
• true → 1로 변환
• false → 0으로 변환

💡 a = 0, b = “0” a 는 0, b 는 “0”일 때 각각을 불린값으로 명시적 변환을 하면 false, true 가 된다. 하지만 비교 연산자로 둘을 비교하면 a == b는 참이 된다. “0” → 0 숫자형으로 변환되기 때문.

일치 연산자

동등 연산자 == 은 0과 false 를 구분하지 못한다.

• 0 == false : true
• ‘’ == false : true

이런 문제는 동등 연산자 == 가 다른 형을 가진 값을 비교할 때 피연산자를 숫자형으로 바꾸기 때문이다.

빈 문자열과 false 는 모두 숫자형으로 변환되면 0이 된다.

0 과 false 를 구분하려면 일치 연산자 === 를 사용해야 한다.

일치 연산자는 엄격한 동등 연산자로, 자료형의 동등 여부까지 검사하기 때문에 피연산자 a와 b의 형이 다를 경우 a === b 는 false 를 반환한다.

• 0 === false : false

불일치 연산자 !== 는 부등 연산자 != 의 엄격한 버전이다.

에러를 줄이기 위해 일치 연산자&불일치 연산자를 사용하는 것이 좋다.

null 과 undefined 비교하기

일치 연산자를 사용해 비교

두 값의 자료형이 다르기 때문에 일치 비교 시 false 가 반환된다.

동등 연산자를 사용해 비교

동등 연산자는 null 과 undefined 를 ‘각별한 커플'처럼 취급하는 규칙이 있어 true 가 반환된다.

숫자형으로 변환시키지 않는다는 것에 주의해야 한다!

두 값 외의 다른 값과 동등 연산으로 비교한다면 모두 false 가 반환된다.

산술 연산자나 기타 비교 연산자 <, >, ≤ ≥ 를 사용해 비교

null 과 undefinde 모두 숫자형으로 변환된다. null은 0, undefined 는 NaN 으로 변한다.

null vs 0

alert( null > 0 );  // (1) false
alert( null == 0 ); // (2) false
alert( null >= 0 ); // (3) true

2번 동등 연산의 경우 null과 일치하는 값은 undefined 뿐이기 때문에 false 가 반환된다.

그러나 1번, 3번 연산의 경우 null이 0으로 변환되어 1번은 거짓, 3번은 참이 된다.

undefined 는 비교가 불가능한 값

alert( undefined > 0 ); // false (1)
alert( undefined < 0 ); // false (2)
alert( undefined == 0 ); // false (3)

1번과 2번 연산에서 undefined 는 NaN으로 변환되고, NaN이 피연산자인 경우 비교 연산자는 항상 false 를 반환한다.

3번 연산에서 undefined 는 null 과만 동등하기 때문에 false 를 반환한다.

함정 피하기

함정을 피할 수 있는 방법으로는 다음과 같은 것들이 있다.

• 일치 연산자 === 를 제외한 비교 연산자의 피연산자로 undefined 나 null 이 오지 않도록 주의한다.
• undedfined 나 null 이 될 가능성이 있는 변수가 <, >, ≤, ≥ 의 피연산자가 되지 않도록 주의한다. 가능성이 있다면 따로 처리하는 코드를 추가한다.

과제

5 > 4 → true 
"apple" > "pineapple" → false : 문자열 간의 비교에서 a는 p보다 작다 
"2" > "12" → true : 문자열 간의 비교에서 2는 1보다 크다 
undefined == null → true
undefined === null → false
null == "\n0\n" → false
null === +"\n0\n" → false