[JS] == 와 ===의 차이점 (동등연산자와 일치연산자)

동등연산자 (==) : Equal Operator

일치연산자 (===) : Strict Equal Operator

 

a 와 b의 값이 같은지를 비교할때

a == b는 값만 같으면 true를 반환하고,

a === b는 값과 값의 종류 (data type)이 모두 같을때 true를 반환한다.

 

 

CASE 1

const a = 1;
const b = "1";

console.log(a == b); // true

console.log(a === b) // false

 

CASE 2

console.log(null == undifined); // true

console.log(null === undifined); // false

null 과 undifined는 값이 없음을 뜻하지만, 값의 종류가 다르다.

 

CASE3

console.log(true == 1); // true

console.log(ture === 1) // false

기본적으로 1은 true, 0은 false로 나타낼 수 있지만, 데이터 타입은 다르다.

 

CASE 4

console.log(0 == "0"); // true

console.log(0 === "0"); // false


console.log(0 == ""); // true

console.log(0 === ""); // false

 

CASE 5

console.log(NaN == NaN); // false

console.log(NaN === NaN); // false

NaN (Not a Number)는 숫자가 아닌 것을 의미하지만 그 값 자체 끼리는 같지 않다.

 

CASE 6

const a = [1, 2, 3];
const b = [1, 2, 3];

console.log(a == b); // false

console.log(a === b); // false

배열을 할당할때, 각 변수는 각 메모리의 주소를 참조한다.

두 변수 a, b는 값과 데이터 타입이 같지만, 이와 상관없이 참조하는 메모리의 주소가 다르기 때문에 a, b는 같지 않다.

 

CASE 7

const a = [1, 2, 3];
const b = [1, 2, 3];
const c =  b;

console.log(b == c); // true

console.log(b === c); // true

새로운 변수 c에 변수 b를 할당 해주면, 변수 c는 b가 참조하는 같은 메모리의 주소를 참조하게 되어

두 변수 c, b는 같다.

이 때, b와 c의 값과 데이터 타입 둘다 같기 때문에 ==와 ===의 결과 값이 동일하다.

 

CASE 8

const a = {};
const b = {};
const c = b;

console.log(a == b); // false
console.log(a === b); // false

console.log(b == c); // true
console.log(b === c); // ture

객체도 배열과 동일하다.