Javascript: Undefined과 null의 차이

김태현·2023년 11월 12일

Javascript

목록 보기
1/2

Javascript를 배우다 보면, undefined와 null 이라는 두 타입에 대하여 배우게 되는데, 처음에 대충 넘겨 배우다보면 이 두개의 차이가 도대체 뭔지, 그냥 둘다 부정형이자 없다는 뜻이 아닌지 여러모로 헷갈리게 느껴진다.

우선 두 타입의 정의부터 이해해보자.

mdn에서 적혀있는 정의이다.

Null 정의

null 은 JavaScript의 원시 값 중 하나로, 어떤 값이 의도적으로 비어있음을 표현하며 불리언 연산에서는 거짓으로 취급합니다.
null은 리터럴로서 null이라 씁니다. null은 undefined과 같이 글로벌 객체의 속성에 대한 식별자가 아닙니다. 대신 null은 식별되지 않은 것을 표현합니다. 즉, 변수가 아무런 객체를 가리키지 않음을 표현합니다. API에서는 null을 종종 관련된 객체가 존재하지 않을 때 그 객체 대신 사용합니다.

Undefined 정의

전역 undefined 속성은 undefined 원시 값을 나타내며, JavaScript의 원시 자료형 중 하나입니다.
undefined는 전역 객체의 속성입니다. 즉, 전역 범위에서의 변수입니다.
최신 브라우저에서 undefined는 설정 불가, 쓰기 불가한 속성입니다. 그렇지 않더라도 덮어쓰는건 피하는게 좋습니다.
값을 할당하지 않은 변수는 undefined 자료형입니다. 메서드나 선언도 평가할 변수가 값을 할당받지 않은 경우에 undefined를 반환합니다. 함수는 값을 명시적으로 반환하지 않으면 undefined를 반환합니다.

각 정의의 핵심

중요한 핵심 문장들을 살펴보자.

우선 null 설명에서
'어떤 값이 의도적으로 비어있음을 표현하며'
null은 식별되지 않은 것을 표현합니다. 즉, 변수가 아무런 객체를 가리키지 않음을 표현합니다.

이 설명처럼 말그대로 '빈 객체'에 해당한다. 식별되지 않은 빈 객체라는 것이다.

이와 다르게 undefined에서는
값을 할당하지 않은 변수는 undefined 자료형입니다. 메서드나 선언도 평가할 변수가 값을 할당받지 않은 경우에 undefined를 반환합니다.

이와 같이 값을 할당하지 않은 변수에 해당한다. 값을 할당 받지 않은 변수가 undefined의 역할이라는 것이다.

따라서 undefined가 반환되는 케이스로는

  • 값을 할당하지 않은 변수
  • 메서드와 선언에서 변수가 할당받지 않은 경우
  • 함수가 값을 return 하지 않았을 때

가 있다.

또 typeof 연산자를 이용하여 null과 undefined의 type을 확인해보면 undefined는 undefined type 그대로 나타나지만, null은 앞서 말했다시피 빈 객체, 빈 object에 해당하므로 object가 나온다는 것을 확인할 수 있다.

결론

위에서 설명한 undefined가 반환되는 케이스에서는 undefined를 사용하면 되지만, 이를 제외한 케이스들중 식별되지 않은 것, 즉 부재를 나타내고 싶다면 항상 null을 사용하면 된다. 또한 null은 빈 객체, undefined는 값을 할당하지 않은 변수 라는 개념을 잘 기억해두고 사용하자.

참고 사이트: https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/undefined
https://2ssue.github.io/common_questions_for_Web_Developer/docs/Javascript/13_undefined&null.html#undefined
https://helloworldjavascript.net/pages/160-null-undefined.html

추가할 수 있는 내용이나, 잘못된 부분이 있다면 댓글로 충고, 지적해주시면 감사하겠습니다.
감사히 수용하여 좀더 좋은 글을 작성하도록 해보겠습니다.

profile
처음에는 웹 frontend 분야에 자신있는, 허나 다양한 분야를 경험하고 배우고자 노력하는 공학자 김태현입니다.

0개의 댓글