[JS] null과 undefined에 대해서

 

 

 

 

JavaScript에서 null과 undefined 모두 '없음'을 나타내는 값이다.

 

얼핏 보면 두 값의 차이가 없는 것 처럼 보이지만 각각의 사용목적은 다르다. 

 

undefined는 값이 대입되지 않은 변수 혹은 속성을 사용하려고 할 떄 반환되는 값이다.

let foo;
foo // undefined

const obj = {};
obj.prop; // undefined

 

null은 '객체가 없음'을 나타내며 typeof 연산을 하였을 때 아래와 같은 값을 반환한다.

typeof null // 'object'
typeof undefined // 'undefined'

 

개발을 할 때 값이  '없음'을 의미하기 위해서 undefined를 쓴다면 아래와 같이 그 의미가 불분명해진다.

let foo; // 값을 대입한 적 없음
let bar = undefined; // 값을 대입함

foo; // undefined
bar; // undefined (??)

let obj1 = {}; // 속성을 지정하지 않음
let obj2 = {prop: undefined}; // 속성을 지정함

obj1.prop; // undefined
obj2.prop; // undefined (??)

 

따라서 undefined가 '없음'을 나타내는 값일지라도, 대입한 적 없는 변수 혹은 속성과, 명시적으로 '없음'을 나타내는 경우를 구분을 할 수 있어야 코드의 의미가 명확해 질 것이다. 그러므로 명시적으로 부재를 나타내고 싶다면 항상 null을 사용하는 것이 좋다.

 

객체를 사용할 때 어떤 속성의 부재를 null을 통해서 나타내는 것 보다는 그 속성을 정의하지 않는 방식이 간편하다.

// 속성의 부재를 Null로 표시하는 경우는 많지 않다.
{
   name: 'Seungha',
   address: null
}

// 필요없는 속성을 정의하지 않는 경우가 많다.
{
   name: 'Seungha'
}

 

 

 

 

Null Check

null이나 undefined는 어느 변수나 속성에도 들어있을 수 있기 때문에 값이 있는 경우와 없는 경우

(즉 null 혹은 undefined인 경우)를 모두 고려해서 코드를 짜야 할 필요가 있다.

function printIfNotNull(input) {
   if (input !== null && input !== undefined) {
      console.log(input);
   }
}



// 아래 세 개의 식은 완전히 같은 의미다.
input !== null && input !== undefined;
input != null;
input != undefined;

// 아래 세 개의 식은 완전히 같은 의미다.
input === null || input === undefined;
input == null;
input == undefined;



null === undefined; // false
null == undefined; // true

null == 1 // false
null == 'hello' // false
null == false // false

undefined == 1 // false
undefined == 'hello' // false
undefined == false // false

 

 

 

 

 

#참고사이트

https://helloworldjavascript.net/pages/160-null-undefined.html