배열 (모던 자바스크립트 Deep Dive)

27.1 배열이란?

• 여러 개의 값을 순차적으로 나열한 자료구조

const array = ['apple', 'banana', 'orange'];

• 배열이 가지는 값을 요소 라고 한다.
• 자바스크립트의 모든 값은 배열의 요소가 될 수 있다.
  • 원시값, 객체, 함수, 배열 등
• 요소는 자신의 위치를 나타내는 0 이상의 정수인 인덱스 를 가진다.
  • 요소에 접근할 때 사용된다.
• 요소 접근은 대괄호 표기법을 사용한다.
  • array[0] → ‘apple’
• 배열은 자신의 길이를 나타내는 length 프로퍼티를 가지고 있다.
  • 순회가 가능하다.
• 배열은 객체 타입이다.
• 배열과 객체의 차이는 값의 순서와 length 프로퍼티이다.

 

27.2 자바스크립트의 배열은 배열이 아니다.

• 자료구조에서 말하는 배열은 메모리 공간이 빈틈없이 연속적으로 나열된 것이다.
• 배열의 요소는 하나의 데이터 타입이며 연속하여 인접해 있기에 밀집 배열이라 한다.
• 정렬되지 않은 배열에서 특정 요소를 검색하는 경우 특정 요소를 발견할 때까지 모든 요소를 검색해야하며 요소를 삽입 또는 삭제하는 경우 연속성을 유지하기 위해 요소를 이동시켜야하는 단점이 있다.
• 그러므로 자바스크립트에서 배열은 각각의 메모리 공간이 동일하지 않아도 되며, 연속적으로 이어져 있지 않을 수도 있다.
  • 연속적으로 이어져 있지 않은 배열은 희소 배열이라 한다.
• 자바스크립트의 배열은 해시 테이블로 구현된 객체이다.
  • 인덱스 요소에 접근하는 것은 일반 배열보다 성능이 느리다.
  • 요소를 삽입과 삭제를 하는 경우에는 일반 배열보다 빠르다.
• 자바스크립트의 배열은 일반 객체와 구별하여 최적화했기 때문에 성능은 일반 객체보다 2배 정도 빠르다.

 

27.3 length 프로퍼티와 희소 배열

• length 프로퍼티는 요소의 개수, 배열의 길이를 나타내는 0 이상의 정수이다.
  • 빈 배열은 length가 0이다.
  • 빈 배열이 아닐 경우 가장 큰 인덱스 + 1 이다.
• length는 요소의 개수가 변경될 때마다 자동 갱신된다.
• length를 임의로 할당할 수 있다.
  • 현재 길이보다 작은 값을 할당하면 배열이 줄어든다.
  • 큰 값을 할당하면 값은 변경되나 실제 배열의 길이가 늘어나진 않는다.
    • 이 경우 실제 배열에는 아무 변함없으며 요소를 위해 메모리 공간을 확보하거나 빈 요소를 생성하는 것은 아니다.
• 희소 배열은 length와 배열 요소의 개수가 일치하지 않기 때문에 사용을 권장하지 않는다.
• 배열에는 같은 타입의 요소를 연속적으로 위치 시키는 것이 가장 맞다.