[자바스크립트] undefined vs undeclared vs null의 차이점

javascript에서 헷갈려하는 null과 undefined의 차이점과

undeclared 변수가 무엇인지, NaN은 무엇인지에 대해 알아보자.

 

 

참고자료1

참고자료2

 

---

          [목차]

• undefined 변수
• undeclared 변수
• null이란
• undefined와 null의 차이
• NaN이란
• isNaN() 함수
• undefined == null 

---

Undefined (미정의 변수)

 

접근 가능한 스코프에 변수가 선언되었으나 현재 아무런 값도 할당되지 않은 상태.

var test;
console.log(test); //undefined
console.log(typeof test); //undefined

타입이 정의되지 않았음을 알 수 있다.

 

 

Undeclared (미선언 변수)

 

접근 가능한 스코프에 변수 선언조차 되어있지 않은 상태.

console.log(test2);

// 오류를 뱉어낸다.
/* Uncaught ReferenceError: test2 is not defined
    at <anonymous>:1:13 */
    
// 이것의 타입을 살펴보면 undefined
console.log(typeof test2); //undefined

미선언변수 test2는 typeof 결과로는 "undefined"를 뱉는다.

실제로 typeof는 undeclared인 경우에도 undefined를 뱉어 브라우저가 오류 처리를 하지 않도록 한다.

 

함수 내에서 변수를 선언 할 때 var를 사용하면 해당 변수는 지역변수가 된다.

그러나 var를 사용하지 않은 변수는 선언한 위치에 상관없이 전역변수가 된다.

이를 유의해야한다.

 

 

Null

 

변수를 선언하고 'null'이라는 빈 값을 할당한 경우이다.

var test3; //변수 선언.
test3 = null; //선언한 변수 test3에 null값 할당.
console.log(test3); //null
console.log(typeof test3); //변수 test3의 타입은 object 객체.

null이라는 빈 값을 할당하면 해당 변수의 타입은 객체가 된다.

 

결국, undefined와 null의 차이점은 

undefined는 타입이 결정되지않은 변수이고,

null은 타입은 객체며, 비어있는 변수이다.

 

 

NaN

 

NaN은 "Not-a-Number"의 약어이다.

표현 불가능한 수치형 결과를 나타내는 값이며,

이 속성은 값이 유효한 숫자가 아니라는 것을 나타낸다.

(헷갈릴 수 있지만 NaN은 숫자값이지만 컴퓨터로는 표현할 수 없는 숫자값..)

var test4 = NaN;
console.log(test4); //NaN
console.log(typeof test4); //타입은 number

*  isNaN() 함수란?

isNaN() 함수는 인자로 받은 값이 숫자가 아니거나 NaN이면 true를 리턴한다.

(boolean형으로 결과값 반환)

 

 

undefined == null

 

우리는 앞서 undefined와 null의 차이점에 대해 살펴보았다.

그러나 undefined == null은 true인데 이건 어떻게 된건지 궁금하신 분들이 계실 것이다.

undefined == null은 true이다. 하지만 undefined === null은 false이다.

 

console.log(undefined == null); //true
console.log(undefined === null); //false

 

비교연산자 ==은 자료형이 다르면 자동형변환으로 자료형을 강제로 맞춰서 비교하는 연산자이다.

따라서, undefined와 null은 자료형이 다르니 자동형변환으로 강제로 맞춰서 값을 비교하면

둘다 값이 없으니 true를 반환한다.

=== 연산자를 이용하면 자료형까지 비교하므로 false를 반환한다.

 

 

---