undefined 제대로 알기 (2) null의 등장

1편 👉🏻 undefined 제대로 알기 (1) undefined? empty? 🧐

 

1편의 첫 부분에서, Javascript에서 undefined 값이 반환되는 경우는 크게 두 가지가 있다고 언급했었다.

 

1. 사용자가 '명시적'으로 지정하는 경우
말 그대로 사용자가 '여기에는 값을 넣지 않을거야'하고 undefined를 통해 알리는 경우이다.

2. Javascript 엔진이 반환하는 경우
Javascript 엔진은 사용자가 어떤 값을 지정할 거라고 예상했는데 하지 않은 경우에 undefined를 반환한다.

 

이 두 가지 경우에서 undefined는 다른 의미로 정의되기도 하고, 동작하는 방식 또한 다르다. 어떻게 다르다는 건지 하나씩 살펴보자.

 

1편에서 empty와 비교했던 경우처럼, 먼저 1. 사용자가 명시적으로 undefined값을 부여하는 경우에 undefined는 그 자체로 '값(value)' 취급을 받는다. 다시 말해 실제로 존재하는 하나의 값으로 판단되는 것이다. 이렇게 값 취급을 받으면 속성(property)도 갖게되고, 순회 대상에도 포함될 수 있게 된다. 그래서 1편의 예제(아래 가져옴)에서처럼 배열의 속성이라고 할 수 있는 index에도 접근이 가능했던 것이다.

 

// 1편 예제
let arr1 = [undefined, 10]; 
arr1.forEach(function (val, i) {console.log(val, i);}; 
// undefined 0 
// 10 1

 

 

하지만 2. Javascript 엔진이 어쩔 수 없이 undefined를 반환하는 경우는 좀 다르다. 이 경우 undefined는 말 그대로 값이 없다는 사실을 나타내는 단어일 뿐이다. 따라서 속성도, index도 존재하지 않는다.

 

여기까지 혼란스러운게 당연하다. 왜 굳이 여러 경우에 undefined를 쓰도록 만들어서, 어떤 경우엔 순회가 되고 어떤 경우엔 순회가 안되는 이런 상황을 만들었나 싶을 것이다. 그리고 이런 예외 상황까지 기억해서 undefined를 써야할까..?하는 마음이 들 수도 있다.

 

null의 등장

일단 Javascript 엔진이 undefined를 반환하는 상황은 우리 맘대로 막을 수 없다. 하지만 사용자인 우리가 undefined를 할당하지 않는건 가능하다. 하지만 정말로 '이 자리는 비었음'을 명시해야하는 경우가 생기면 어떻게 해야할까? null은 바로 이런 상황을 대처하기 위한 용도로 만들어졌다. 

 

null 또한 '비어있음'을 의미하며 사용자가 할당한 undefined와 같은 기능을 한다. 어떻게 보면 원래 undefined가 혼자 다 하던 일들 중 일부를 null이 대신 맡아준 것이라고 비유할 수도 있겠다.

 

1. 사용자가 명시적으로 할당하는 경우
말 그대로 사용자가 '여기에는 값을 넣지 않을거야'하고 undefined를 통해 알리는 경우이다.
👉🏻 null이 대체

2. Javascript 엔진이 반환하는 경우
Javascript 엔진은 사용자가 어떤 값을 지정할 거라고 예상했는데 하지 않은 경우에 undefined를 반환한다.
👉🏻 undefined

 

null 사용 시 주의사항

마지막으로 이렇게 등장하게 된 null을 사용할 때 주의해야할 사항을 소개하며 글을 마치려고 한다. typeof를 사용해 null의 타입을 확인해보면 object타입이라고 나오는 것을 볼 수 있다.

 

let a = null;
console.log(typeof a);    //object

 

이 부분은 Javascript 자체 버그이기 때문에, 어쩔 수 없이 우리는 어떤 값이 null인지 확인하려면 다른 방법을 사용해야 한다. 다른 방법으로는 === 연산자를 사용하는 방법이 있다. 여기서 하나더 주의할 점은 == 연산자를 사용하면 undefined와 구분하지 않기 때문에, 반드시 정확한 비교를 위해서는 === 연산자를 사용해야 한다는 것이다.

 

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

console.log(a == null);         // true
console.log(a == undefined);    // true

 

 

요약

정리해보면 null은 사용자가 명시적으로 '값이 없다', '비었다'는 것을 표시하기 위해 할당하는 값이다. undefined는 값이 실제로 존재하지 않는 경우를 의미한다. 물론 undefined도 의도적으로 값이 없음을 표시하기 위해 할당할 수 있지만, 혼란을 방지하기 위해 그렇게 사용하는 건 지양하는 편이 좋을 것 같다. 결론 : 우리가 의도적으로 값이 없다는걸 알리고 싶을 땐 null을 쓰자!