AJAX에서 return 받은 결과값을
여러 함수에서 이용하려다가
자꾸 값이 똑같아져서...
AJAX 동기화 문제인가.. 함수 순서때문인가.. 어리둥절하다가 알아냄...^.ㅠ
내 문제는 이거였다..
array2 값을 c와 d에 따로 담아서
c의 값을 바꿨는데 d값도 덩달아 바뀐거...
let array2=[{"key":"메뉴","value":"짜장"},{"key":"사이드","value":"탕수육"}];
let c = array2;
let d = array2;
c[0].value="짬뽕";
console.log(d[0].value); //짬뽕 출력
심지어 아래와 같은 방식으로 복사를 했는데도 자꾸 값이 바뀌는 것이었다...
for(let i in array2){
c[i] = array[i];
d[i] = array[i];
}
같은 예라고 할 수 있겠다. 이것이 바로 참조값(주소값)이 복사가 되는 얕은 복사.
let array=["1","2","3"];
let a = array;
let b = array;
a[0]="text";
console.log(b[0]); //"text" 출력
a <- array 주소값
b <- array 주소값
이렇게 담기면서
a[0]을 변경 -> array[0] 변경 -> b[0] 변경
이렇게 되었던것..
깊은복사 방법
1. 반복문으로 때려넣기
반복문으로 값을 하나하나 때려넣어주면 참조값이 아닌 값이 들어가기 때문에
더이상 영향을 받지 않는다.
let array3 = ["a","b","c"];
let e=[];
let f=[];
for(let i in array3){
e[i] = array3[i];
f[i] = array3[i];
}
e[0]="eee";
console.log(f[0]); //"a" 출력
JSON 구조의 배열일 경우 {키:값}을 하나하나 때려넣어 줘야한다
let array4=[{"key":"동물","value":"갱쥐"},{"key":"동물","value":"보노보노"}];
let x = [];
let y = [];
for(let i in array4){
x.push({"key":array4[i].key,"value":array4[i].value});
y.push({"key":array4[i].key,"value":array4[i].value});
}
x[0].value="포로리";
console.log(y[0].value); //"갱쥐" 출력
2. slice
slice 를 이용해도 깊은 복사가 된다.
slice 는 start 부터 end 까지 대상 배열에서 꺼내와 새로운 배열을 만들어 값을 집어 넣는다.
start 와 end 가 주어지지 않으면 전체 배열을 복사한다.
let array5 = ["aa","bb","cc"];
let v = array5.slice();
let w = array5.slice();
v[0]="ddd";
console.log(w[0]);
3. Object.assign
Object.assing()은 뒤의 인자를 앞에 인자에 합쳐 넣는다.
var o1 = {name:'kim'};
var o2 = Object.assign({},o1);
o2.name='kim2';
console.log(o1,o2); //{name: "kim"} {name: "kim2"}
