[javascript] 배열 복사 시 주의사항

배열을 복사할 때, 특히 이중 배열(Not Nested Array)에서

원본 데이터와의 관계를 이해하는 것이 중요합니다.

배열을 단순히 복사하면, 원본 데이터와 복사된 배열이 동일한 포인터를 공유하여

한쪽의 데이터를 변경하면 다른 쪽에도 영향이 미칩니다.

 

1차원 배열 복사

아래의 예시처럼 1차원 배열을 복사할 때는 다음과 같은 방법이 일반적입니다.

const keywordArray = ["가습기", "사무실용", "콜드브루앰플"];

// 간단한 복사
let copyKeywordArray = [...keywordArray];

이러한 방식으로 복사하면, 원본 배열 keywordArray와 copyKeywordArray는 서로 독립적인 배열이 됩니다.

 

이중 배열 복사 문제점

하지만 이중 배열의 경우, 배열의 내부 요소가 또 다른 배열이기 때문에,

간단히 복사하면 원본 데이터를 공유하게 됩니다. 예를 들어:

const keywordArray = [
    ["가습기", "사무실용", "콜드브루앰플", "사무실용", "미니가습기", "유아용가습기"],
    ["가습기", "사무실용", "콜드브루앰플", "사무실용", "사무실가습기", "유아용가습기"],
    ["가습기", "장갑", "연말선물추천", "장갑", "가습기", "유아용가습기"],
    ["가습기", "장갑", "연말선물추천", "장갑", "소형가습기", "유아용가습기"],
    ["가습기", "미니가습기", "사무실용", "설날선물", "출산선물", "유아용가습기"],
    ["가습기", "미니가습기", "사무실용", "미니가습기", "사무실가습기", "유아용가습기"],
]

// 이렇게 복사하면 문제가 발생합니다
let copyKeywordArray = [...keywordArray];

이 경우, copyKeywordArray의 내부 배열을 변경하면 keywordArray의 내부 배열도 함께 변경됩니다.

배열 실습 이미지

 

올바른 이중 배열 복사 방법

이중 배열을 안전하게 복사하기 위해서는 다음과 같이 각 내부 배열을 개별적으로 복사해야 합니다:

let copyKeywordArray = [];
for (let i = 0; i < keywordArray.length; i++) {
    copyKeywordArray[i] = [...keywordArray[i]];
}

 

 

이 방법을 사용하면, 각 내부 배열이 독립적으로 복사되어 원본 데이터가 안전하게 유지됩니다.