더글라스 크락포드의 자바스크립트 핵심가이드를 정리한 문서입니다.
총 10장으로 이루어진 책으로 한 장씩 정리하여 포스팅할 예정입니다.
본 책은 자바스크립트의 좋은 점만을 정리한 책으로, 나쁜 점을 잊어야 할 수고를 덜 수 있습니다.
배열이란?
배열은 번호와 번호에 대응하는 데이터로 이루어진 자료구조를 뜻합니다. 일반적으로 배열에는 같은 종류의 데이터들이 순차적으로 저장되어, 값의 번호가 곧 배열의 시작점으로 부터 저장되어 있는 상대적인 위치가 됩니다.
프로그래밍 언어에서 배열은 해쉬 테이블
의 자료구조를 사용하기 때문에 매우 빠른 데이터 접근이 가능합니다. 하지만, 자바스크립트(이하 JS)에는 배열을 지원하지 않고, 이와 유사한 배열 객체를 지원합니다. 따라서, 일반적인 배열과 같은 성능면에서 이득은 얻기 어렵습니다. 성능은 좋지 않지만 데이터 구조로서 유용하기 때문에 배열객체와 내장 메소드를 알아보도록 하겠습니다
배열 객체
배열객체는 다른 언어처럼 대괄호를 사용하여 정의할 수 있습니다. 정적언어 처럼 배열의 크기를 정의가 필요없고, 바로 할당하면 배열 객체가 생성됩니다. 배열 객체는 표현식으로 자리할 수 있는 모든 곳에 위치가 가능합니다. Index는 0부터 시작합니다. 배열의 최대 크기는 32bit(2³²)로 정해져 있습니다
var array_literal = [1, 2, 3, 4];
JS에서는 정적 프로그래밍 언어와는 다르게 배열 요소들의 데이터 타입에 대한 제한이 없습니다.
mixed_list = ['one', 2, 3.0, {'four':'four, 'five':'five'}, null ];
Length 속성
다른 언어와 JS의 차이중 하나는 Length 속성에 대한 평가입니다. 일반적으로 length는 배열의 실제 개수를 반환하지만, JS에서는 가장 큰 요소의 인덱스에 1을 더한 값을 반환합니다.
var list = [1,2,3,4];
list.length; // 4
list[1000] = 0;
list.length; // 1001
length 속성은 호출뿐만 아니라 할당이 가능합니다. 단, 배열의 크기보다 작은 값을 할당하면 값 이상의 요소들은 모두 삭제됩니다.
list = [1,2,3,4,5,6];
list.length; // 6
list.length = 3;
list; // [1,2,3]
요소추가
배열에 요소를 추가하는 방법은, index를 이용하여 추가하는 방법과 배열의 push 내장메소드를 사용하는 것입니다
list = [1,2,3,4,5]
list.length; // 5
list[5] = 6;
list; // [1,2,3,4,5,6]list.push(7);
list; // [1,2,3,4,5,6,7]
요소 삭제
splice 메소드는 배열에서 요소를 삭제하고, 삭제한 요소를 배열로 반환합니다.
splice(삭제할 요소 index, 삭제할 요소 개수)
list = [1,2,3,4,5];
deleted = list.splice(0,2);
deleted; // [1,2]
list; // [3,4,5
push메소드는 제일 큰 요소를 삭제하고, 삭제한 요소를 반환합니다.
push()
list = [1,2,3,4,5];
deleted = list.pop();
deleted; // 5
list; // [1,2,3,4]
요소 나열(열거)
length 속성과 반복문을 활용하여 배열의 모든 값을 접근할 수 있습니다.
for in
구문은 배열의 순서를 보장하지 않으며, 프로토타입체인의 값을 접근하기 때문에 배열시엔 사용하지 않습니다
list = [1,2,3,4,5];
for (i=0 ; i<list.length ; i++){
console.log(list[i]);
}
배열의 Custom 메소드
JS에서 배열은 객체이기 때문에 원하는 기능을 메소드로 추가할 수 있습니다.
Array.prototype.reduce = function(f, value){
var i;
for(i=0 ; i<this.length ; i++){
value = f(this[i], value);
}
return value
};
reduce함수는 f 함수에 값을 전달하여 배열의 차원을 줄이는 역할을 합니다. value는 누적된 값을 저장하는 초기값입니다. 따라서 항등원 값을 초기값을 사용합니다. f 함수가 곱연산을 하면 1, 합연산을 하면 0을 초기값으로 사용합니다.
function add(a, b){
return a + b;
}function multipy(a, b){
return a * b;
}list = [1,2,3,4,5];
list.reduce(add, 0); // 15
list.reduce(multiply, 1); 120
배열의 크기와 차원
JS에서는 배열 초기화 함수가 없기 때문에 직접구현해야합니다. 아래는 1차원 배열을 생성하고 초기화하는 함수입니다
Array.dim = function(dimension, initial){
var a = [], i;
for( i=0 ; i<dimension, i++ ){
a[i] = initial;
}
return a;
}
list = Array.dim(5, 0:
list; // [0, 0, 0, 0, 0]
아래는 2차원 배열을 생성 및 초기화하는 함수입니다
Array.dim_2d = function(m, n, initial) {
var outer=[], inner=[], i=0, j=0;
for (i=0 ; i<n ; i++){
inner[i]=initial;
} for (j=0 ; j<m ; j++){
outer[j]=inner;
}
return outer;
}list = Array.dim(5, 3, 1);
list; // [ [1,1,1], [1,1,1], [1,1,1], [1,1,1], [1,1,1]]