키를 사용해 식별 가능한 값을 담은 컬렉션은 객체라는 자료구조를 이용하여 값을 저장한다. 그런데 개발을 진행하다 보면 첫 번째 요소, 두 번째 요소, 세 번째 요소 등과 같이 순서가 있는 컬렉션이 필요할 때가 생기곤 한다. 사용자나 물건, HTML 요소 목록같이 일목요연하게 순서를 만들어 정렬하기 위해서다.

순서가 있는 컬렉션을 다루어야 할 때 객체를 사용하면 순서와 관련된 메서드가 없어 그다지 편리하지 않다. 객체는 태생이 순서를 고려하지 않고 만들어진 자료구조이기 때문에 객체를 이용하면 새로운 프로퍼티를 기존 프로퍼티 사이에 끼워넣는 것 또한 불가능하다.

이럴 땐 순서가 있는 컬렉션을 저장할 때 쓰는 자료구조인 배열을 사용할 수 있다.

자바스크립트에서의 배열은 다른 언어들의 배열과 다르다.

보통 다른 언어들의 배열에서는 한 배열에는 같은 자료형의 데이터만 포함이 가능하고,

데이터의 메모리 주소가 연속으로 나열된다. 따라서 접근은 빠르지만 중간 요소의 추가나 제거는 느린 특징이 있다.

하지만 자바스크립트의 배열은 배열의 형태와 동작을 흉내내는 특수 객체이다.

한 배열에 다양한 자료형의 데이터가 들어갈 수 있고, 연속 나열이 아니다. (엔진에 따라 요소들의 타입이 동일하면 연속으로 배열하기도 한다.)

접근은 상대적으로 느리지만, 중간 요소의 추가나 제거가 빠르다는 특징을 가진다.

배열 선언

아래 두 문법 중 하나를 사용하면 빈 배열을 만들 수 있다.

let arr = new Array();
let arr = [];

대괄호 안에 초기 요소를 넣는 것도 가능하다.

let fruits = ["사과", "오렌지", "자두"];

각 배열 요소에는 0부터 시작하는 인덱스가 매겨져 있다. 이 수들은 배열 내 순서를 나타낸다. 배열 내 특정 요소를 얻고 싶다면 fruits[0] 와 같이 대괄호 안에 인덱스를 넣어 주면 된다. 같은 방법으로 요소를 추가하거나, 수정하는 것도 가능하다. 프로퍼티인 length 를 사용하면 배열에 담긴 요소가 몇 개인지 알아낼 수 있다. alert(fruits) 를 사용하면 요소 전체가 출력된다.

또한, 배열 요소의 자료형에는 제약이 없다. (다른 프로그래밍 언어와의 차이점)

다음과 같이 배열을 만들어도 상관이 없다.

let arr = [”사과”, { name: “이보라”} , true, function() { alert(”안녕하세요.”);} ];