카테고리 없음

Null vs Undefined (typeScript)

노엠디엔 2024. 5. 30. 11:09

 

타입스크립트를 사용하면서 null과 undefined 중
undefined를 사용하는 것을 권장한다는글을 많이 보게 되었다.
그 이유가 궁금해서 알아보게 되었다.

"Use undefined, do not use null."

(해당 블로그가 정리가 잘되어있다!)

참고 블로그 : https://blog.shiren.dev/2021-10-05/

 

일단 자바스크립트에서 null과 undefiined 차이점

  • undefined는 아직 초기화되지 않은 값, 존재하지 않는다,
    자바스크립트에서 엔진이 대신 undefined로 초기화해준다.
  • null 은 빈 값을 표현하는 값, 존재는 한다.(마치 빈 스트링 같이),
    사용자가 직접 초기화한다.

그럼 왜 타입스크립트에서는 undefined를 사용하라고 할까?

자바스크립트에서 null과 undefined의 차이는 초기화되지 않는
값과 빈값의 차이인 이유와 함께
자바스크립트 엔진이 초기화를 자동으로 해주나 vs
사용자가 직접 초기화를 해줘야 하는 값으로 나눈다

첫 번째 이유는 자바스크립트 엔진 동작에서 알 수 있듯이
자바스크립트 엔진은 undefined를 사용한다!

 

두 번째 이유는 "null의 사용은 falsy 한 값이 더 추가되는 것이다.

개발자의 의도로 null을 사용하게 된다면 falsy한 값을 확인해야
하는 상황에서 undefined와 null 두 가지를 모두 명시적으로 확인해야 한다.
예를 들어 number 변수의 경우 숫자 0 값과 
null 값과 undefined를 모두 확인해야 한다?

 

세 번째 이유는

새롭게 알게 된 사실로 typeof null값을 찍어보면
object값이 발생한다 (자바스크립트의 버그)
 

 

이러한 이유에서 null 값의 문제점이 있다고 한다 

하지만 undefined 또한 문제가 없는 건 아니라고 하는데

undefined만 사용했을 때의 문제점

첫 번째 문제 
undefined는 키워드임에도 불구하고 키워드로 취급하지 않아
식별자로 사용될 수 있다.
이것도 새롭게 알게 된 사실!

 

두 번째 문제DOM API가 null을 사용한다고 한다.

MDN 사이트에서 해당 설명을 찾지 못해서 gpt에게 물어봄

 

세 번째 문제는 JSON에서는 undefined를 사용하지 못한다는 점입니다.

JSON에서는 옵셔널 한 값이 없는 경우 null을 사용합니다.
 
undefined은 JSON 스펙에서 사용할 수 없는 값이라고 하며
undefined 값을 넣어 사용하려고 하면  값이 삭제되어 전달되는 걸 확인할 수 있다.

 

타입스크립트를 사용해 보면서 null을 사용해야 할지 undefined를
사용해야 할지 고민이 많았는데
솔직히 사용하면서
두 값을 사용하는 데에 큰 문제는 없었던 것 같다.

여러 도구들의 발전과 업그레이드로 이러한 문제도
나중에는 사라지지 않을까 하는 생각이 든다.

 

더글락스락스 크록포드의 null과 undefined : https://www.youtube.com/watch?v=PSGEjv3Tqo0&t=561s