비교연산자

비교 연산자

• 보다 큼·작음: a > b, a < b
• 보다 크거나·작거나 같음: a >= b, a <= b
• 같음(동등): a == b
• 같지 않음(부등): a != b

불린형 반환

비교 연산자의 반환 값은 불린형입니다.

• true가 반환: ‘긍정’, ‘참’, '사실’을 의미
• false가 반환: ‘부정’, ‘거짓’, '사실이 아님’을 의미

반환된 불린값은 다른 여타 값처럼 변수에 할당 할 수 있습니다.

 

alert( 2 > 1 );  // true
alert( 2 == 1 ); // false
alert( 2 != 1 ); // true

let result = 5 > 4; // 비교 결과를 변수에 할당
alert( result ); // true

문자열 비교

'사전편집(lexicographical)'순: 자바스크립트는 ‘사전’ 순으로 문자열을 비교합니다. 즉 사전 뒤쪽의 문자열은 사전 앞쪽의 문자열보다 크다고 판단됩니다.

자바스크립트도 문자열을 구성하는 문자 하나하나를 비교해가며 문자열을 비교합니다.

 

alert( 'Z' > 'A' ); // true
alert( 'Glow' > 'Glee' ); // true
alert( 'Bee' > 'Be' ); // true

 

자바스크립트는 대·소문자를 따집니다. 대문자 'A' > 'a' 입니다. 자바스크립트 내부에서 사용되는 인코딩 표인 유니코드에선 소문자가 대문자보다 더 큰 인덱스를 갖기 때문이죠.

 

다른 형을 가진 값 간의 비교

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

 

alert( '2' > 1 ); // true, 문자열 '2'가 숫자 2로 변환된 후 비교가 진행됩니다.
alert( '01' == 1 ); // true, 문자열 '01'이 숫자 1로 변환된 후 비교가 진행됩니다.

 

불린값: true는 1, false는 0으로 변환됩니다.

 

alert( true == 1 ); // true
alert( false == 0 ); // true

let a = 0;
alert( Boolean(a) ); // false

let b = "0";
alert( Boolean(b) ); // true

alert(a == b); // true! 동등 비교 연산자 ==는 피연산자를 숫자형으로 바꿈

일치 연산자

동등 연산자(equality operator) ==은 형이 다른 피연산자를 비교할 때 피연산자를 숫자형으로 바꿉니다.

빈 문자열과 false는 숫자형으로 변환하면 0이 되죠.

0과 false를 구별하지 못합니다.

alert( 0 == false ); // true

피연산자가 빈 문자열일 때도 같습니다.

 

alert( '' == false ); // true

일치 연산자(strict equality operator) ===를 사용하면 형 변환 없이 값을 비교할 수 있습니다.

alert( 0 === false ); // false, 피연산자의 형이 다르기 때문입니다.

‘불일치’ 연산자 !==는 부등 연산자 !=의 엄격한 버전입니다.

 

null이나 undefined와 비교하기

일치 연산자 ===를 사용하여 null과 undefined를 비교: 두 값의 자료형이 다르기 때문에 거짓이 반환됩니다.

 

alert( null === undefined ); // false

 

동등 연산자 ==를 사용하여 null과 undefined를 비교

true가 반환됩니다. 동등 연산자는 null과 undefined를 '각별한 커플’처럼 취급합니다. 

 

alert( null == undefined ); // true

 

산술 연산자나 기타 비교 연산자 <, >, <=, >=를 사용하여 null과 undefined를 비교

 

null과 undefined는 숫자형으로 변환됩니다. null은 0, undefined는 NaN으로 변합니다.

 

null vs 0

null과 0을 비교해 봅시다.

 

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

(1) , (3): 기타 비교 연산자의 동작 원리에 따라 null이 숫자형으로 변환돼 0이 되기 때문입니다.

 

(2): 동등 연산자 ==는 피연산자가 undefined나 null일 때 형 변환을 하지 않습니다. undefined와 null을 비교하는 경우에만 true를 반환하고, 그 이외의 경우(null이나 undefined를 다른 값과 비교할 때)는 무조건 false를 반환합니다.

비교가 불가능한 undefined

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이 오지 않도록 주의!
• 또한, undefined나 null이 될 가능성이 있는 변수가 <, >, <=, >=의 피연산자가 되지 않도록 주의!

 

<복습 질문> null과 undefined, 0을 서로 비교하면?