undefined는 ‘아무 값도 할당받지 않은 상태’를 의미한다.
var 키워드로 선언한 변수는 암묵적으로 undefined로 초기화된다.
변수를 선언한 이후 값을 할당하지 않은 변수를 참조하면 undefined가 반환된다.
변수를 참조했을 때 undefined가 반환된다면 선언 이후 값이 할당되지 않은 즉, 초기화되지 않은 변수라는 것을 알 수 있다.
예시)
var a;
console.log(a); // undefined
console.log(typeof a); // undefined
null은 ‘비어있는, 존재하지 않는 값'(값의 부재)을 의미한다.
프로그래밍 언어에서 null은 변수에 값이 없다는 것을 의도적으로 명시(의도적 부재)할 때 사용한다.
변수에 null을 할당하는 것은 변수가 이전에 참조하던 값을 더 이상 참조하지 않겠다는 의미이다.
예시)
var element = document.querySelector('.myClass');
// HTML 문서에 myClass 클래스를 가진 요소가 없다면 null을 반환한다.
console.log(element); // null
함수가 유효한 값을 반환할 수 없는 경우에 명시적으로 null을 반환하기도 한다.
예를 들어 HTML 요소를 검색하는 document.qureySelecter 메서드는 조건부에 부합하는 HTML 요소를 검색할 수 없는 경우 에러 대신 null을 반환한다.
이에 대해서는 null 보다는 undefined를 반환하는 것이 타당하다는 의견도 있다.
출처: https://hanamon.kr/javascript-undefined-null-%EC%B0%A8%EC%9D%B4%EC%A0%90/