undefined

<aside> 💡 값이 존재하지 않을 때 자바스크립트 엔진이 자동으로 반환해주는 값이다.

</aside>

자바스크립트 엔진은 다음과 같은 상황에서 undefined를 반환한다.

• 값을 할당하지 않은 식별자에 접근할 때
• 객체 내부의 존재하지 않는 프로퍼티에 접근할 때
• return 문이 없거나 호출되지 않는 함수의 실행 결과

즉, 사용자가 값을 지정해 줄 것이라고 예상하였지만 그렇게 되지 않았을 때 자동으로 undefined를 준다.

실제로는 undefined를 자동으로 할당해준다고 생각하기 쉽지만 사실은 아무것도 할당하지 않고

var a
console.log(a) // undefined

var obj = { a: 1 }
console.log(obj.a) // 1
console.log(obj.b) // undefined
console.log(b) // ReferenceError: b is not defined

var func = function() {}
var c = func()
console.log(c) // undefined

undefined와 배열

값을 대입하지 않은 배열의 경우에는 조금 특이하다.

var arr1 = []
arr1.length = 3
console.log(arr1) // [ <3 empty items> ]

var arr2 = new Array(3)
console.log(arr2) // [ <3 empty items> ]

var arr3 = [undefined, undefined, undefined]
console.log(arr3) // [undefined, undefined, undefined]

<aside> 💡 빈 배열의 길이를 늘리거나 new Array()를 사용하여 배열을 만들었을 시에는 undefined도 할당되지 않는다. 즉, 비어 있는 요소와 undefined를 할당한 요소는 아예 다르다.

</aside>

var arr1 = [undefined, 1]
var arr2 = []
arr2[1] = 1 // [empty, 1]
console.log(arr2[0]) // undefined

arr1.forEach(function(data, index) {console.log(data, index)}) 
// undefined 0 / 1 1
arr2.forEach(function(data, index) {console.log(data, index)}) 
// 1 1

‘비어 있는 요소’의 경우 배열 메서드들의 순회 대상에서 제외된다. 당연히 아무것도 없는 요소는 순회할 수 없으니까.