자바스크립트에서 '값이 없음'을 나타내는 두 가지: null과 undefined의 차이

자바스크립트에는 '값이 없음'을 나타내는 두 가지 값이 있습니다. 바로 null과 undefined입니다. 이 두 값은 비슷해 보이지만 의미와 용도가 완전히 다르기 때문에 상황에 맞게 구분해서 사용해야 합니다.

undefined란?

undefined는 변수에 아직 값이 할당되지 않았음을 의미하는 자바스크립트의 원시(primitive) 값입니다. 변수를 선언만 하고 초기화하지 않으면 자동으로 undefined가 됩니다. 또한 평가하려는 변수에 값이 없거나, 함수가 명시적으로 값을 반환하지 않을 때도 undefined가 반환됩니다.

예제

let a;
console.log(a);

function b() {}
console.log(b());

출력 결과

undefined
undefined

위 예제에서 변수 a는 선언만 되고 값이 할당되지 않았으므로 undefined이며, 함수 b()도 return 문이 없어 undefined를 반환합니다.

null이란?

null은 '의도적으로 값이 비어 있음'을 나타내는 할당 값입니다. 개발자가 변수에 값이 없다는 사실을 명시적으로 표현하고 싶을 때 직접 할당합니다.

예제

let a = null;

function b() {
  return null;
}
console.log(a);
console.log(b());

출력 결과

null
null

null과 undefined의 타입 확인

typeof 연산자로 두 값의 타입을 확인하면 흥미로운 결과를 볼 수 있습니다.

• undefined의 타입은 "undefined"입니다.
• null의 타입은 "object"로 표시됩니다. 이는 초기 자바스크립트 구현 과정의 버그로 알려져 있지만, 기존 코드와의 호환성을 위해 지금까지 그대로 유지되고 있습니다.

예제

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

핵심 정리

결론적으로, 값이 존재하지 않음을 개발자가 명확히 표현하고 싶다면 null을 사용하고, 값이 아직 정해지지 않은 상태라면 undefined가 자연스럽게 사용됩니다. 두 값의 차이를 정확히 이해하면 더 안전하고 가독성 높은 코드를 작성할 수 있습니다.