JavaScript

-Null

lshjju 2026. 2. 15. 16:36

'비어있음'을 선언하는 명시적인 신호인 null에 대해 알아보겠습니다.

앞서 배운 undefined가 "어쩌다 보니 비어있는 상태"라면, null은 개발자가 **"여기는 의도적으로 비어있는 곳이야!"**라고 확실히 도장을 찍어둔 상태입니다.


 

https://www.khan.co.kr/article/202211260600001



1. null이란 무엇인가?

null은 자바스크립트의 원시 자료형 중 하나로, 어떠한 객체도 나타내지 않는 빈 값을 의미합니다.

  • 의도적인 빈 값: 변수에 값이 없다는 것을 프로그래머가 고의로 할당한 것입니다.
  • 객체의 부재: 나중에 객체가 담길 예정이거나, 더 이상 객체를 참조하지 않을 때 연결을 끊기 위해 사용합니다.

2. 실전 예제 코드: "의도적인 비움"

JavaScript
 
// 1. 변수에 값이 없음을 명시적으로 표현
let userProfile = null; 

// 나중에 데이터를 받아오면 값을 채워넣습니다.
userProfile = { name: "Gemini", age: 2 };

// 2. 객체 참조 해제 (메모리 관리)
// 더 이상 이 데이터가 필요 없을 때 null을 대입하여 연결을 끊습니다.
userProfile = null; 

// 3. 존재하지 않는 요소를 찾을 때
// DOM에서 없는 아이디를 찾으면 자바스크립트는 null을 반환합니다.
const element = document.getElementById('none-existent-id');
console.log(element); // null

3. 주의해야 할 특징: typeof null

자바스크립트에는 아주 오래된 유명한 버그가 하나 있습니다.

JavaScript
 
console.log(typeof null); // "object"

논리적으로는 "null"이 나와야 할 것 같지만, 자바스크립트 초기 설계 당시의 실수로 인해 "object"라고 출력됩니다.

이는 이미 너무 많은 웹 사이트의 코드들이 이 방식에 의존하고 있어 수정되지 않고 남아있는 특징이므로, **"null은 객체가 아니지만 typeof 결과는 object이다"**라는 점을 꼭 기억해야 합니다.


4. null과 undefined 비교 연습

JavaScript
 
// 둘 다 '값이 없음'을 뜻하지만, 비교할 때 결과가 다릅니다.

console.log(null == undefined);  // true (느슨한 비교: 둘 다 비어있다는 맥락은 같음)
console.log(null === undefined); // false (엄격한 비교: 자료형 자체가 다름)

// 조건문에서의 활용 (둘 다 Falsy 값)
if (!null) {
    console.log("null은 거짓으로 취급됩니다."); // 실행됨
}

학습 정리

  • **null**은 개발자가 "값이 없음"을 나타내기 위해 직접 넣는 값이다.
  • **typeof null**이 "object"인 것은 자바스크립트의 유명한 설계상 특징(오류)이다.
  • 초기화되지 않은 상태는 undefined, 명시적으로 비운 상태는 **null**을 사용하여 구분하는 것이 좋다.

'무(無)'를 나타내는 두 가지 방법인 undefined와 null을 모두 마스터하셨습니다!

'JavaScript' 카테고리의 다른 글

console.log()  (0) 2026.02.15
ECMAScript  (0) 2026.02.15
Undefined  (0) 2026.02.15
Truthy and Falsy  (0) 2026.02.15
JS coding rule and style guide  (0) 2026.02.15