개발 지식 한스푼

JavaScript _ 다차원 배열

Monstera Olive 2025. 1. 28. 13:53
반응형

 

 

JavaScript 배열은 다차원 배열(Multidimensional Array)을 지원합니다. 다차원 배열이란 배열 안에 배열이 요소로 포함된 구조를 의미합니다. 가장 흔히 사용되는 형태는 2차원 배열과 3차원 배열입니다. 이러한 배열은 데이터를 행렬, 표, 그래프 등으로 표현할 때 자주 사용됩니다.

 

 

2차원 배열 (2D Array)

  • 배열의 요소가 배열인 구조입니다.
  • 행(Row)과 열(Column) 형태로 데이터를 저장합니다.
  • 주로 테이블, 행렬, 게임 보드, 지도 등을 표현할 때 사용합니다.
const matrix = [
    [1, 2, 3],
    [4, 5, 6],
    [7, 8, 9]
];

console.log(matrix[0][0]);    // 1 (첫번째 행, 첫번째 열)
console.log(matrix[1][2]);    // 6 (두번째 행, 세번째 열)

matrix[2][1] = 99;
console.log(matrix[2][1]);    // 99

function createMatrix(rows, cols) {
    let matrix = [];

    for (let i = 0; i < rows; i++) {
        matrix[i] = [];

        for (let j = 0; j < cols; j++) {
            matrix[i][j] = i * j;
        }
    }
    return matrix;
}

const myMatrix = createMatrix(3, 3);
console.log(myMatrix);

/*
    출력 결과 :
    [
        [0, 0, 0],
        [0, 1, 2],
        [0, 2, 4]
    ]
*/

 

 

3차원 배열(3D Array)

  • 배열 안에 2차원 배열이 포함된 구조입니다.
  • 층(Layer), 행(Row), 열(Column) 형태로 데이터를 저장합니다.
  • 이미지 처리, 3D 좌표, 시뮬레이션 등에서 사용됩니다.
const cube = [
    [
        [1, 2],
        [3, 4]
    ],
    [
        [5, 6],
        [7, 8]
    ]
];

console.log(cube[0][0][1]);    // 2 (첫번째 레이어, 첫번째 행, 두번째 열)
console.log(cube[1][1][0]);    // 7 (두번째 레이어, 두번째 행, 첫번째 열)

function create3DArray(x, y, z) {
    let array3D = [];

    for (let i = 0; i < x; i++) {
        array3D[i] = [];

        for (let j = 0; j < y; j++) {
            array3D[i][j] = [];

            for (let k = 0; k < z; k++) {
                array3D[i][j][k] = `(${i}, ${j}, ${k})`;
            }
        }
    }
    return array3D;
}

const space = create3DArray(2, 2, 2);
console.log(space[1][0][1]);    // (1, 0, 1)

 

 

다차원 배열의 순회

  • 2차원 배열을 순회할 때는 중첩 반복문을 사용합니다.
const matrix2D = [
    [1, 2, 3],
    [4, 5, 6],
    [7, 8, 9]
];

for (let i = 0; i < matrix2D.length; i++) {
    for (let j = 0; j < matrix2D[i].length; j++) {
        console.log(`matrix2D[${i}][${j}] = ${matrix2D[i][j]}`);
    }
}

 

  • 3D 배열의 경우 3중 반복문을 사용합니다.
const cube = [
    [
        [1, 2],
        [3, 4]
    ],
    [
        [5, 6],
        [7, 8]
    ]
];

for (let i = 0; i < cube.length; i++) {
    for (let j = 0; j < cube[i].length; j++) {
        for (let k = 0; k < cube[i][j].length; k++) {
            console.log(`cube[${i}][${j}][${k}] = ${cube[i][j][k]}`);
        }
    }
}

 

 

다차원 배열과 메모리

  • 2차원 배열은 메모리 상에서는 단순히 배열의 배열로 저장되며, 연속적이지 않을 수도 있습니다.
  • 3차원 배열은 각 배열이 중첩된 형태로 메모리에 저장되며,
    데이터 구조가 커질수록 메모리 사용량이 급격하게 증가합니다.

 


 

 

2차원 배열은 행렬이나 표 형태의 데이터를 저장할 때, 3차원 배열은 공간 데이터를 표현할 때 유용합니다. JavaScript의 배열은 크기와 타입에 제한이 없으므로 다양한 다차원 구조를 구현할 수 있습니다. 하지만 다차원 배열은 복잡도가 증가하기 때문에, 필요할 경우 적절한 데이터 구조와 반복문 설계가 필요합니다.

반응형

'개발 지식 한스푼' 카테고리의 다른 글

JavaScript _ 프로토타입 (Prototype)  (0) 2025.01.27
ReactJS _ React Hook 이란?  (0) 2025.01.25
ReactJS _ export default  (1) 2025.01.22
ReactJS _ 폰트 추가 및 설정  (0) 2025.01.20
ReactJS _ JSX란?  (0) 2025.01.19