Frontend/JavaScript

[js] ==와 ===의 차이점과 비교연산자

양원준 2024. 4. 7. 05:17
728x90

 

js는 ==, ===  2개의 동등 비교 연산자가 있다

 

  • == : 동등연산자
  • === : 엄격한 일치연산자

로 부른다

 

 

 

 

 

다음과 같이 ==는 값만 같으면 true, ===는 값과 데이터 타입까지 같아야 true를 반환한다

 

console.log('1' == 1) //true
console.log('1' === 1) //false

console.log(null == undefined) // true 
console.log(null === undefined) // false 

console.log(0 == "") // true, 빈문자열과 0은 false이기 때문
console.log(0 === "") // false, 위와 같지만 데이터 타입이 다름

 

 

 

 

 

 

배열과 객체의 경우에는 어느경우에도 해당하지 않는다

왜냐하면 배열이나 객체를 할당할 때, 변수는 주소를 참조하기 때문이다

 

직접 배열을 비교하는 경우에도, 아래 [1,2,3]은 실행될 때마다 새로운 메모리 주소에 배열을 생성하기 때문에 서로 다른 주소를 가르킨다

 

let a = [1, 2, 3];
let b = [1, 2, 3];
console.log(a == b); // false 
console.log(a === b); // false 
console.log([1, 2, 3] == [1, 2, 3]); // false 

var x = {}; 
var y = {}; 
console.log(x == y) // false 
console.log(x === y) // false

 

 

 

 

 

문자열 비교

 

문자열은 사전순(정확히 말하면 유니코드순)으로 비교된다

 

console.log( 'Z' > 'A' ); // true
console.log( 'Glow' > 'Glee' ); // true
console.log( 'Bee' > 'Be' ); // true

 

  • 맨앞글자부터 유니코드로 비교
  • 비교값이 같으면 뒷순서로 넘어감
  • 끝까지 똑같을 경우 길이가 더 큰 글자가 큰 값

 

 

 

 

null과 undefined

 

console.log( null === undefined ) //false
console.log( null == undefined ) //true

 

 

  • ===는 false를 반환 -> 자료형이 다르기 때문
  • ==는 true를 반환
    • == 는 비교를 할때 피연산자를 형변환한다
    • == null과 undefined를 형변환 하지 않는다(둘이 비교하는 경우에만 true)를 반환
  • 하지만, 기타 산술연산자( >,  <, >=, <= ) 에서는 null은 0, undefined는 NaN으로 변환한다

이러한 사항들 때문에 아래의 케이스들이 나온다

 

 

 

1) null과 0의 비교

alert( null > 0 );  // false
alert( null == 0 ); // false
alert( null >= 0 ); // true

 

 

 

 

 

2) undefined와의 비교

console.log( undefined > 0 ); // false 
console.log( undefined < 0 ); // false
console.log( undefined == 0 ); // false

 

 

 

 

 

 

 

728x90