null과 undefined 의 차이 이해하기

null과 undefined 

자바스크립트에서 "비어있는 값"을 정의하는 변수 중 하나인 null과 undefined 에 대해서 알아보고자 합니다. 이 두 값은 같으면서도 다른 값인데요. 이번 포스팅에선 이 두가지의 값의 차이점에 대해서 알아보고자 합니다. 

 

 

null과 undefined ?

 

자바스크립트에서 6가지 fasly value가 있습니다. 

 

- 0 (숫자 0)

- false ( boolean )

- "" (비어있는 문자열)

- null

- undefined

- NaN (Not a Number)

 

null과 undefined는 모두 비어있는 값을 의미하는 변수입니다. 

 

null, undefined 차이점

 

그럼 null과 undefined의 차이점에 대해서 알아보도록 하겠습니다. 공통점은 위에서 보여드린바 대로 "비어있는 값" 으로 같은 점을 가지고 있습니다. 

 

null

null은 명시적으로 비어있거나 존재하지 않는 값을 나타냅니다. 그리고 null은 "할당" 되어야만 존재할 수 있는 값입니다. 

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

 

null의 타입은 object입니다. 

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

 

undefined

undefined는 비어있지만 값 할당이 이루어지지 않음을 나타내는 것입니다. 예를 들면 이런거죠.

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

값이 할당되어 있지 않으면 컴퓨터는 그 값을 자동적으로 undefined를 할당합니다. 즉 "내"가 아닌 "컴퓨터"가 할당하는 값이죠. 

 

덧붙여 undefined는 직접 할당도 가능합니다. 

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

 

그리고 undefined의 타입은 undefined입니다. 

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

 

null과 undefined의 비교

 

동등연산자(==) 를 사용하면 null과 undefined는 서로 다른 값입니다. 

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

이유는 위에서 살펴봤듯이 둘의 타입이 서로 다르기 때문입니다. null은 객체타입이며 undefined는 undefined이기 때문이지요. 이 부분에 대해선 여러사람들이 초기 자바스크립트의 설계오류라는 말을 많이 합니다. 

 

일치연산자(===)를 사용하면 null과 undfined는 서로 같은 값입니다. 

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

 

마치며

null과 undefined 에 대해 간단하게 알아보았습니다. 둘다 비어있는 값으로 같다고는 하지만 저는 개인적으로 null과 undefined중 null을 자주 사용하는 편입니다. 그게 코드상으로도 명확하게 제가 컨트롤 할 수 있는 값을 의미하는 것이기도 하기 때문이죠. 여러분들은 어떤 값을 주로 사용하시나요?

 

긴 글 읽어주셔서 감사합니다.