코어 자바스크립트란 책을 읽으면서 스스로 정리한 내용입니다
혹시 잘못된 내용이 있으면 수정하겠습니다.
우선 nullrhk undefined 모두 자바스크립트에서 "없음"을 나타내는 값이다. 물론 당연한 말이지만 두개의 차이점이있고 그에 따라 사용하는 목적이 달라진다.
undefined는 사용자가 지정할 수도 있지만 값이 존재 하지 않을 때 자바스크립트 엔진이 자동으로 부여하는 경우도있다.
자바스크립트 엔진이 undefined를 부여하는 경우는 아래와 같다.
let a;
console.log(a) //undefined
let obj={a:1};
console.log(obj.b)//undefined
let func = function(){}
let func2 = func()
console.log(func2)//undefined
위와 같은 코드로 간단하게 undefined결과물이 나오는걸 확인 할 수 있다.
그리고 비어있는 요소는 순회와 관련 많은 배열 메서드에서 순환 대상에서 제외된다. 이게 무슨 말인지 알기 위해 아래 코드를 보도록 하자.
let arr1 = [undefined,1]
let arr2 = []
arr2[1]
arr1.forEach(function(v,i){console.log(v,i)})//undefined 0 //1 1
arr2.forEach(function(v,i){console.log(v,i)})//1 1
둘의 차이점을보면 arr1에서는 배열의 모든 요소를 순회하여 결과를 출력하였다. 하지만 arr2에서는 forEach()
메서드가 어떠한 처리도 하지 않고 건너 뛰었다는걸 알 수 있다.
우선적으로 배열도 객체다 라는걸 생각하면 당연한 결과이다.
배열은 무조건 length
프로퍼티의 개수 만큼 빈 공간을 확보하고 각 공간의 인덱스를 이름으로 지정할거라 생각하지만 사실상 객체와 마찬가지로특정 인덱스 값을 지정할 때 빈 공간을 확보하고 인덱스를 이름으로 지정하고 데이터 주솟값을 저장하는 동작을 한다.
결론적으로 값지 정해지지 않은 인덱스는 아직 존재하지 않는 프로퍼티다 라는 말이다.
이제 다시 위의 코드를 이해해 보면 arr1에서는 undefined
는 이 자체로 값이된다. 똑같이 비어있습니다 라고 나타내는 값이라도 하나의 값으로 동작을 해서 프로퍼티나 배열의 요소는 고유 키값을 가지게 되고 이러한 이유로 순회를 할 수 있는 대상이됩니다.
arr2에서 자바스크립트 엔진이 어쩔 수 없이 undefined
를 할당한 경우에는 해당 프로퍼티나 인덱스 값이 없음을 의미합니다.
앞에서 내용을 보고 혼란스러울 수 있다. 그런데 이 혼란을 피하는 방법은 단순하다. 그냥 둘중 하나 사용 하지 않으면 된다.
즉 직접 undefined
를 할당 해 주지 않으면 된다.
할당을 해줄때는 undefined
가 아닌 null
을 써주면된다.
애초에 null
은 이러한 용도로 만든 데이터 타입이다.
한가지 주의 할점은
console.log(typeof null) //"Object"
console.log(typeof undefined) //"undefined"
null
은 타입이 object라는 점이다. 이것은 javscript의 버그이다. 그럼 변수 값이 null
인지 확인 하려면 어떻게 해야할까?
동등 연산자(==) 일치 연산자(===)를 사용하면 된다.
let n = null
console.log(typeof n)//object
console.log( n == undefined)//true
console.log( n == null )//true
console.log( n === undefined)//false
console.log( n === null )//true
보다시피 null과 undefined모두 동등연산자에서는 같다고 판단합니다.
결론적으로 일치연산자를 사용해야 정확히 판별 할 수 있습니다.