undefined와 null

1. undefined

• undefined는 자바스크립트에서 "없음"을 나타내는 값 중에 하나이다. 
• 사용자가 명시적으로 지정할 수도 있지만 값이 존재하지 않을 때 
• 다음 세 경우에 undefined를 반환하다.
  • 값을 대입하지 않은 변수, 즉 데이터 영역의 메모리 주소를 지정하지 않은 식별자에 접근할 때
  • 객체 내부의 존재하지 않는 프로퍼티에 접근하려고 할 때
  • return 문이 없거나 호출되지 않는 함수의 실행 결과
• 자동으로 undefined를 부여하는 경우

// 자동으로 undefined가 할당되는 것이 아니라 
// 아무것도 할당하지 안혹 끝난다. 접근할 때 undefined을 반환한다.
let a;

// 값을 대입하지 않은 변수에 접근: undefined;
console.log(a);

let obj = { a: 1};
// 1
console.log(obj.a);

// 존재하지 않는 프로퍼티에 접근: undefined;
console.log(obj.b);

let func = function() { };
let c = func();
// 반환(return)값이 없으면 undefined를 반환한 것으로 안다.  
console.log(c);

 

• 빈 요소와 배열의 순회

let arr1 = [undefined, 1];
let arr2 = [];
arr2[1] = 1;

// (undefined 0) , (1, 1) 
arr1.forEach((v, i) => { console.log(v, i)});
// (1, 1)
arr2.forEach((v, i) => { console.log(v, i)});

// [NaN, 2]
arr1.map((v, i) => { return v + i });

// [비었음, 2]
arr2.map((v, i) => { return v + i });

// [ undefined ]
arr1.filter((v) => { return !v; });

// []
arr2.filter((v) => { return !v; });

• 위에처럼 비어있는 요소와 "undefined"를 할당한 요소는 출력 결과부터 다르다. 비어있는 요소는 순회와 관련된 많은 배열 메서드들의 순회 대상에서 제외된다. 
• 각 메서드들이 비어 있는 요소에 대해서는 어떠한 처리도 하지 않고 건너뛰었음을 알 수 있다. 
• undefined가 비록 "비어있음"을 의미하긴 하지만 하나의 값으로 동작하기 떄문에 프로퍼티나 배열의 요소는 고유의 키값(프로퍼티 이름)이 실존하게 되고, 따라서 순회의 대상이 될 수 있다. 
• 만약 사용자가 아무것도 하지 않은채 자바스크립트 엔진이 반환해주는 undefined는 해당 프로퍼티 내지 배열의 키값 자체가 존재하지 않음을 의미한다. 
• 자바스크립트 엔진이 반환해주는 undefined는 문자 그대로 값이 없음을 나타낸다. 

 

2. null

• null은 자바스크립트에서 "없음"을 나타내는 값 중에 하나이다.
• "비어있음"을 명시적으로 나타내고 싶을 때는 undefined보다 null을 쓰면 된다.
• null은 애초에 이런 용도로 만든 데이터 타입이다. 
• 한 가지 주의할 점은 typeof null은 object이다. 자바스크립트 자체 버그이다. 
• 그래서 null인지 판별하려면 다른 방식으로 접근해야한다.

let n = null;
// object
console.log(typeof n);

// true
console.log(n == undefined);

// true
console.log(n == null);

// false
console.log(n === undefined);

// true
console.log(n === null);

• 동등 연산자(==)로 비교할 경우 null과 undefined가 서로 같다고 판단한다.
• 그래서 일치 연산자(===)를 사용해서 값과 데이터 타입도 함께 비교해서 좀 더 엄격하게 비교한다. 그러면 정확히 판별할 수있다.