[JavaScript] undefined와 null은 무엇이 다른걸까?

문제

자바스크립트의 타입 중 undefined와 null은 공통적으로 '값을 가지고 있지 않은 상태'라는 뜻을 갖고 있다.

하지만, 우리 같은 초보 코린이들에게 다르게 생긴 두 개의 값이 하나의 같은 뜻을 가지고 있다는 건 매우 헷갈리는 문제이다. 따라서 undefined와 null이 무엇이 같고 무엇이 다른지 일목요연하게 정리할 필요가 있다.

 

비교

let a;
console.log(a); // undefined

undefined의 경우 변수를 선언할 때 변수에 아무런 값을 넣지 않은 경우 undefined가 변수의 '값'으로서 할당된다.

즉, 변수 a는 아무것도 선언한 것이 없지만 사실 따져보면 undefined라는 값이 a에 할당되어 있다고 보면 된다.

이것은 개발자가 의도적으로 할당한 값이 아닌 자바스크립트 엔진에 의해 할당되어진 값인 것이다. (가만있었는데 할당을 당했음)

 

let b = null;
console.log(b); // null

반면에 null의 경우 직접 변수에 null 값을 할당해주어야 한다. 개발자가 의도적으로 null 값을 넣어 이 변수는 '비어 있음'을 명시적으로 보여줄 때 사용하며 주로 객체를 담을 변수를 초기화할 때 많이 사용된다.

 

console.log(typeof a); // undefined
console.log(typeof b); // object (null이 아니다)

또 한 가지 차이점이 있다면 undefined의 타입은 undefined 그대로이지만, null의 타입은 object라는 점이다.

null은 undefined와 달리, object이지만 비어있는 object를 나타내기 때문에 타입으로 object를 반환하게 되는 것이다.

즉, undefined는 그냥 '값이 없음'을 나타내지만 null은 '값이 없음'보다는 '비어 있음'을 나타낸다고 이해하면 좋다.

 

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

undefined와 null을 비교하는 비교 연산자의 차이점도 알아두면 좋다. 둘 다 값이 없음을 나타냄으로  '=='의 경우 true를 반환한다. 하지만, 타입은 undefine는 undefined, null은 object로 서로 다르기 때문에 '==='의 경우 false를 반환한다.

 

1. undefined는 그냥 변수에 값이 없음을 나타내는 타입.
2. null은 변수에 값이 없음을 '명시적으로' 나타내는 타입. ("저 값이 없는 아이에요!" 라고 소리치는 격)
3. 둘은 '값이 없다'는 공통점이 있지만, 타입은 undefined와 object로 다름.