자바스크립트에서의 배열의 요소는 원시값, 객체, 함수 배열 등 어떤 값이든 될 수 있다. 이러한 배열을 희소 배열(Sparse Array)이라 한다. 따라서 자바스크립트의 배열은 엄밀히 말해 일반적인 의미의 밀집 배열(Dense Array)이 아니며, 일반적인 배열의 동작을 흉내 낸 특수한 객체다.
// 희소 배열
const num = [1, 2, 3]
num.length = 2
console.log(num) // [1, 2]
num.length = 5
console.log(num) // [1, 2, empty*3]
const num1 = [1, , 2, , 3]
console.log(num1) // [1, empty, 2, empty, 3]
배열 생성
// 배열 리터럴
const arr = [1, 2, 3]
// Array 생성자 함수
const arr = new Array(3)
// Array.of
Array.of(1) // output: [1]
Array.of(1, 2, 3) // output: [1, 2, 3]
// Array.from
// 유사배열객체 또는 이터러블 객체를 인수로 받아 [배열로 변환]하여 반환
Array.from({ 0: 'shj', 1: 'heonje-shin', length: 2 }) // output: ["shj", "heonje-shin"]
Array.from('shj') // output: ["s", "h", "j"]
유사 배열 객체는 마치 배열처럼 인덱스로 프로퍼티 값에 접근할 수 있고(key가 인덱스), length 프로퍼티를 갖는 객체를 말한다. querySelectorAll이나document.body.children으로 엘리먼트를 가져오면 유사 배열 객체에 담겨서 온다.
const shj = {
0: 'shj',
1: 'heonje-shin',
2: 'FE',
length: 3,
}
// for 문으로 순회 가능
for (let i = 0; i < shj.length; i++) {
console.log(shj[i]) // output: 'shj', 'heonje-shin', 'FE'
}
하지만 배열처럼 push, pop, join, map과 같은 메서드 사용은 불가, 일반 객체처럼 프로퍼티로 접근 불가하다.