JavaScript 2차원 배열

자바스크립트의 2차원 배열이란?

자바스크립트는 제대로된 2차원 배열은 없다.

let arr = [][]; 이와 같은 한 번에 2차원 배열 선언이 불가능하다.

약간의 트릭을 통하여 2차원 배열과 비슷한 배열을 만들 수 있다.

아래의 예제 중 상황에 맞는 방법을 사용하면 된다.

초기값을 할당하여 배열 생성

// arr[5][2]
let arr = [['a','b'], ['c', 'd'], ['e', 'f'], ['g', 'h'], ['i', 'j']]; 

반복문을 사용하여 빈 배열 생성

// arr[5][2]
let arr = new Array(5);

for (let i = 0; i < arr.length; i++) {
    arr[i] = new Array(2);
}

2차원 배열 생성 함수를 만들어서 사용

function create2DArray(rows, columns) {
    let arr = new Array(rows);
    for (let i = 0; i < rows; i++) {
        arr[i] = new Array(columns);
    }
    return arr;
}

// arr[5][2]
let arr = create2DArray(5, 2);

Array 객체에 배열 생성 함수를 추가하여 사용

Array.matrix = function (m, n, initial) {
    let a, i, j, mat = [];
    for (i = 0; i < m; i += 1) {
        a = [];
        for (j = 0; j < n; j += 1) {
            a[j] = initial;
        }
        mat[i] = a;
    }
    return mat;
};

// matrix('행', '열', '기본값')
let arr = Array.matrix(5, 2, 0);

- 자바스크립트 핵심 가이드 (더글라스 크락포드) p109

ES6를 지원하는 최신 브라우저라면 사용 가능한 방법

// arr[5][2] (빈 배열 생성)
const arr1 = Array.from(Array(5), () => new Array(2)

// arr[5][2] (null로 초기화하여 생성)
const arr2 = Array.from(Array(5), () => Array(2).fill(null))

자바스크립트의 2차원 배열은 1차원 배열에 또 다른 배열 객체를 추가하여 2차원 배열 만드는 방법을 사용한다. 자바스크립트 배열의 특성을 잘 모른다면 조금 이상한 방법으로 보일 수도 있다.

자바스크립트의 배열은 동적으로 배열의 크기를 조절할 수 있으며, 배열에는 모든 유형의 변수 그리고 함수, 객체도 담을 수 있어서 유연하게 사용할 수 있지만 그만큼 충분히 이해를 하고 사용해야 한다.

출처: https://gent.tistory.com/296