본문 바로가기
Javascript/자바스크립트 문제

[Javascript] 이차원, 다차원 배열 생성법

by isfp_yykkng 2024. 8. 6.

[Javascript] 이차원, 다차원 배열 생성법

자바스크립트는 다른 언어와 다르게 한번에 2차원 배열 선언이 불가능하다.

var arr =[][];

 

위와 같이 코드를 입력하면 오류가 난다. 즉, 다른 언어의 일반적인 이차원 배열 선언문과 같이는 생성할 수 없다. 이차원 배열을 생성하려면 약간의 트릭을 통하여 2차원 배열과 비슷한 배열을 만들 수 있다.

이차원 배열 생성 방법

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

배열 안에 값을 모두 넣어서 2차원 배열을 생성한다.

// 5행 2열짜리 배열 (5*2)
var arr = [['a','b'], ['c', 'd'], ['e', 'f'], ['g', 'h'], ['i', 'j']];

 

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

new Array( n ) 을 통해서 1차원 배열을 만들고 해당 배열을 반복하면서 각각에 new Array( n ) 으로 2차원 배열 생성한다. 

// 5행 2열짜리 배열 (5*2)
var arr = new Array(5);

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

 

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

Array.matrix = function (m, n, initial) {
    var 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('행', '열', '기본값')
var arr = Array.matrix(5, 2, 0);

 

4. ES6를 이용한 최신 방법⭐⭐⭐

Array.from() 메서드를 이용하여 1차원 배열을 만들고, 그에 대해 콜백함수로 new Array( n )을 만들어서 2차원 배열을 생성한다. 그리고 이에 대해 Array.fill() 메서드를 통해서 안에 값을 채울 수 있다.

// 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차원 배열 만드는 방법을 사용한다. 자바스크립트의 배열은 동적으로 배열의 크기를 조절할 수 있으며, 배열에는 모든 유형의 변수 그리고 함수, 객체도 담을 수 있어서 유연하게 사용할 수 있다.

다차원 배열 생성 방법

for문을 이용해 2차원 배열을 생성한 것처럼 for문을 더 이용하여 다차원 배열을 생성할 수 있다.

let x = new Array(3); // 1차원 배열 생성
for(let i=0; i<3; i++){
    x[i] = new Array(3); // 2차원 배열 생성
    for(let j=0; j<3; j++){
        x[i][j] = new Array(3); //3차원 배열 생성
    }
}