본문 바로가기

javascript

Javascript Array Copy

반응형

배열을 사용할 떄 주의해야 할 점은 Copy 할때 발생한다.
보통 일반적인 변수와 같이 사용해서 인데 같은 메모리를 참조하는 경우
단순하게 Copy 후 이전 배열 값을 변경하면 Copy 한 값까지 바뀌는 경우를 종종 볼 수 있다.
색을 하다가 아주 정리를 잘 해 놓은 글이 있어서 스크랩!!
다음부터 실수 하지 않도록 꼭 기억해 두자!

//1.같은 메모리 참조

var arr1 = [1,2,3];

var arr2 = arr1;

console.log(arr1==arr2); //결과:true

arr1[0] = 11;

console.log(arr1); //결과:[11, 2, 3]

console.log(arr2); //결과:[11, 2, 3]



//2.다른메모리참조

//2-1. ArrayObj.slice(begin[,end])

// :원래는 array의 일부를 발췌하여 새로운 array를 만드는 함수지만

// 파라미터를 넣지 않으면 새로운 array만 리턴된다.

var arr1 = [1,2,3];

var arr2 = arr1.slice();

console.log(arr1==arr2); //결과:false

arr1[0] = 11;

console.log(arr1); //결과:[11, 2, 3]

console.log(arr2); //결과:[1, 2, 3]


//2-2. ArrayObj.concat(arrayName2, arrayName3, ..., arrayNameN)

// :Array 개체들을 서로 결합하여 새로운 배열변수를 만드는 함수.빈 array를 concat하면 새로운 array만 리턴된다.

var arr1 = [1,2,3];

var arr2 = arr1.concat([]);

console.log(arr1==arr2); //결과:false

arr1[0] = 11;

console.log(arr1); //결과:[11, 2, 3]

console.log(arr2); //결과:[1, 2, 3]


//3.JSON Array

// Array의 값이 JSON Object 이면 slice나 concat함수를 사용해도 array자체는 별도로 존재하지만

// 내용인 JSON Object가 같은 메모리를 참조한다.

// 그래서 해당 인덱스의 JSON Object 값을 변경하면 다른 array의 값도 동일하게 변경된다.

var arr1 = [{A:"1", B:"2"},{A:"1", B:"2"}];
var arr2 = arr1.concat([{C:"3"}]);

console.log(arr1==arr2); //결과:false
arr1[0].A = "11";
console.log(arr1); //결과:[Object { A="11", B="2"}, Object { A="1", B="2"}]
console.log(arr2); //결과:[Object { A="11", B="2"}, Object { A="1", B="2"}, Object { C="3"}]

//JSON Array 를 내용까지 다른 메모리를 참조하도록 복사하려면

//급한데로 이렇게...

var arr2 = JSON.parse( JSON.stringify(arr1) ); //json api를 사용해서 문자열로 변경후 다시 새로운 object로 만든다...


출처 : http://door83.blog.me/80127169446


반응형

'javascript' 카테고리의 다른 글

Mac에서 NVM (Node Version Management) 설치하기  (0) 2018.08.02