[JavaScript] null과 undefined 비교

October 06, 2019

javascript

null과 undefined는 비슷해 보이지만 엄연히 다르다. 이 두 개의 개념 차이를 명확히 알아두자.

먼저 undefined에 대해 알아보자. undefined는 변수를 선언만 하고 값을 할당하지 않은 것.
즉, 자료형이 결정되지 않은 상태이다.

var a;
console.log(a); // 출력결과 > undefined
console.log(typeof a); // 출력결과 > undefined

위의 코드를 보면 a라는 변수를 선언만하고 값을 할당하지 않았기 때문에 변수 a를 출력하면 undefined이 출력되고 변수 a의 자료형 역시 결정되지 않은 상태이기 때문에 변수 a의 type을 출력하면 undefined가 출력된다.

반면에 null은 변수를 선언한 뒤 null이라는 빈 값을 할당한 것이다.

var b = null; // null 이라는 빈 값을 할당했다.
console.log(b); // 출력결과 > null
console.log(typeof b); // 출력결과 > object

위의 코드를 보면 b라는 변수를 선언한 후 null이라는 값을 할당했기 때문에 변수 b를 출력하면 null이 출력되고 null값은 객체로 취급되기 때문에 변수 b의 type을 출력하면 object가 출력된다.

아니 지금까지 null과 undefined는 다른 것이라고 설명해 놓고 null == undefined의 결과는 왜 true인가?

console.log(null == undefined); // 출력결과 > true
console.log(null === undefined); // 출력결과 > false

비교 연산자 ==는 자료형이 다르면 자료형을 강제로 맞춰서 비교한다.

따라서 undefined와 null은 자료형이 다르니 자바스크립트 엔진에서 자동으로 자료형을 강제로 맞춘 후, 둘 다 값이 없는 것이라는 사실을 확인하기 때문에 true를 반환한다.

반면에 비교 연산자 ===는 자료형까지 동일한지 비교하기 때문에 null === undefined는 false를 반환한다.

👩🏻‍💻Frontend Developer