#기본기5_비교연산자 (==와 ===, null과 undefined)

비교연산자	설명	예시	결과
==	두 값이 동등한지 비교합니다. 형 변환을 수행합니다.	1 == '1'	true
===	두 값이 정확하게 일치하는지 비교합니다. 형 변환을 수행하지 않습니다.	1 === '1'	false
!=	두 값이 부등한지 비교합니다. 동등 연산자(==)의 반대입니다.	1 != '1'	false
!==	두 값이 정확하게 불일치하는지 비교합니다. 일치 연산자(===)의 반대입니다.	1 !== '1'	true

 

1. == 와 != 는  형변환을 수행한다. 

• 자바스크립트는 동등,부등 비교 연산자를 사용할 때, 피연산자의 데이터 타입이 다를 경우 타입을 일치시키기 위해 형 변환을 수행한다
• 문자열과 숫자를 비교시, 문자열을 숫자로 변환한다.
• 불리언 값과 다른 데이터 타입을 비교시, 불리언 값을 숫자로 변환한다.

2. === 와  !==는 형변환을 수행하지 않고 엄격하게 값을 비교한다.

// 동등비교연산자_문자열과 숫자의 비교
console.log(1 == "1") // true, "1" 이 숫자 1로 형변환되어 비교
console.log(1 != '1') // false, "1" 이 숫자 1로 형변환되어 비교, 서로 같은 타입/값이므로 !=는 false가 나오게됨

console.log(1 !== '1') //true, 형변환x 숫자1과 문자열 '1'과의 비교 
console.log(1 === "1") // false, 형변환x 숫자1과 문자열 '1'과의 비교 
console.log(1 === 1) // true, 숫자 1과 숫자 1의 비교

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

3. 불린형

불린형반환

다른 연산자와 마찬가지로 비교 연산자 역시 값을 반환합니다. 반환 값은 불린형입니다.

• true가 반환되면, ‘긍정’, ‘참’, '사실’을 의미합니다.
• false가 반환되면, ‘부정’, ‘거짓’, '사실이 아님’을 의미합니다.

// 비교연산자_불린형 반환
alert(2 > 1); // true
alert(2 == 1); // false
alert(2 != 1); // true

// 반환된 불린값은 다른 여타 값처럼 변수에 할당할 수 있음
let result = 5 > 4; // true
alert(result); // true

 

true는 1, false는 0으로 변환된다.

// 동등연산자 형변환
alert( true == 1); // true
alert( false == 0); // true


// 일치연산자 형변환x
alert( true === 1); // false
alert( false === 0); // false

4. 문자열비교 

// 1. 문자열은 서로의 유니코드를 비교해서 대소관계를 판별한다 
// 2. 알파벳 뒤로 갈수록 유니코드 값이 크다
// 3. 소문자가 대문자보다 유니코드 값이 크다
// 4. 길이가 다른 문자열의 경우 한글자씩 비교하여 대소관계를 판별한다.
// 5. 길이가 다른 문자열이 같은 문자가 반복될 경우 서로 비교하다가 더 문자열이 긴 쪽이 값이 큰쪽으로 판별된다.

// 1번은 모두 적용됨
alert( 'B' > 'A') // true, 2번
alert( 'a'> 'A') // true, 3번

alert( 'galaxy' > 'galoxy') // true, 4번
alert('Babo' > 'Bz') // false, 4번 
alert( 'Babo' > 'Ba') // true, 5번

 

5. null과 undefined

1. null: "값이 없음"을 나타냅니다. 명시적으로 변수에 null을 할당하여 해당 변수가 의도적으로 값이 없음을 나타낼 수 있습니다. null은 객체가 존재하지 않음을 나타내는데 사용됩니다. 예를 들어, 어떤 객체의 프로퍼티가 존재하지 않을 때 해당 프로퍼티 값은 보통 null로 설정됩니다.
2. undefined: "정의되지 않음"을 나타냅니다. 변수가 선언되었지만 값이 할당되지 않은 경우에는 해당 변수의 값은 자동으로 undefined로 설정됩니다. 또한 객체의 프로퍼티가 선언되지 않은 경우에도 해당 프로퍼티의 값은 undefined입니다.

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

// 비교연산시 null은 0으로 변환됨
// 동등비교연산시 null은 오직 undefined 혹은 자신과만 동등함
alert( null > 0 );  // (1) false
alert( null == 0 ); // (2) false
alert( null >= 0 ); // (3) true


// 비교연산시 undefined는 NaN으로 변환됨
// 동등비교연산시 undefined는 오직 null 혹은 자신과만 동등함
alert( undefined > 0 ); // false (1)
alert( undefined < 0 ); // false (2)
alert( undefined == 0 ); // false (3)

 

출처 : javascript.info, chat gpt