본문 바로가기

JavaScript/Basic-Javascript

자바스크립트 정리하며 배우기[04] - Data type[기본 타입(primitive) - null 과 undefined 개념 및 차이]

안녕하세요. Tay 입니다.

자바스크립트의 nullundefined 두 타입 모두 '값이 비어있음' 을 나타낸다.

 

 

undefined

  • 값이 비어있음
  • 할당 되지 않은 상태
  • undefined 타입 이자 값을 나타낸다

 

null

  • 값이 비어있음
  • 명시적으로 '값이 비어있음' 을 할당 한 상태
  • null 은 object

 

이 두 타입의 개념과 차이를 아래의 예제로 확인 해보자.

 

1. index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <script src="null_undefined.js"></script>
</body>
</html>

2. null_undefined.js

var nullVar;

console.log(nullVar);

이것의 출력 결과는 무엇일까?

 

결과 :

nullVar 에 아무것도 할당하지않았으니 초기 값으로 undefined 값을 갖게된다.

 

변수에 null 을 할당 하면 결과는 어떻게 될까? 다음 예제를 통해서 확인 해보자.

 

 

var nullVar;

console.log(nullVar);

nullVar = null;

console.log(nullVar)

 

결과 :

두번째 log 는 null 이 출력됐다. 즉, undefined 는 할당 하지않은 상태 , null 은 할당 한 상태 이다.

 

그렇다면 null 의 타입은 null 일까? 다음 예제를 통해서 확인 해보자.

 

 

var nullVar;

console.log(nullVar);

nullVar = null;

console.log(nullVar);

console.log(typeof(nullVar));   // null type check
console.log(typeof(nullVar) === null);
console.log(nullVar === null);

 

결과 :

<최종 결과>

console.log(typeof(nullVar) === null);		// false
console.log(nullVar === null);			// true

 

※ 여기서 알수 있듯이 null 의 type 의 object 이다 

 

 

자, 그렇다면 위 예제들를 통해 얻은 결과를 다음과 같이 정리하겠다.

  • 할당 되지않은 변수는 undefined type 이다.
  • null 은 할당 된 '값이 없음' 을 의미 한다.
  • null 의 type 은 object 이다.

 

Github Commit

 

 

이 글은 개인 공부목적으로 작성되었습니다.

정보가 잘못 되거나 궁금한 사항은 댓글로 부탁드립니다!! 읽어주셔서 감사합니다.