본문 바로가기
STUDY/JavaScript

[JavaScript] JSON(4) 참조복사

by bottlesun 2022. 11. 27.
728x90

01. 참조복사

배열 , JSON 객체 끼리의 복사는 참조 처리 된다.

01-1. 일반 변수 끼리 복사하는 경우

원본이 변경 되어도 복사본에는 영향을 주지 않는 것을 알 수 있다.

let a = 100;
let b = a;
console.log("a = " + a + ", b = " + b);
// a = 100, b = 100 출력
a++;
console.log("a = "+a+",b = " + b);
//a = 101, b = 100 출력

01-2. 참조복사 (=앝은복사)

배열이나 JSON 원본을 수정하면 복사본도 함께 수정 된다. (반대의 경우도 마찬가지)

const user = {
    name : "Lee"
};
const member = user;
console.log(user , member);
// { name: 'Lee' } { name: 'Lee' } 출력
member.name = "Kim";
console.log(user , member);
// { name: 'Kim' } { name: 'Kim' } 출력

01-3. 배열끼리의 값 복사 (=깊은복사)

원본과의 동일한 길이의 길이를 가진 배열을 생성한 후 반복문을 통해서 배열 속 원소의 값을 개별 복사해 준다.

const a1 = [1,2,3];
// 원본과 동일한 길이를 갖는 배열을 생성
const a2 = new Array(a1.length);
// 배열을 온전히 값 복사하기 위해서는 원소끼리 개별 복사 해야함
for( let i = 0 ; i < a1.length; i++){
    a2[i] = a1[i]
}
// 배열객체가 갖는 매서드를 활용한 깊은 복사 방법
const a3 = a1.slice();
console.log(a1,a2,a3);
// [ 1, 2, 3 ] [ 1, 2, 3 ] [ 1, 2, 3 ] -> [원본] [반복문복사][slice()복사]
a1[0] += 100;
console.log(a1,a2,a3);
// [ 101, 2, 3 ] [ 1, 2, 3 ] [ 1, 2, 3 ]
// 원본은 값이 바뀌지 않음을 확인 할 수있다.

01-4. JSON,객체의 깊은복사

깊은복사 방법은 배열을 할때와 똑같이, 빈 객체를 생성 후 그 빈 객체속에 값들을 넣어주면 된다.

const addr = {
    city:'서울',
    gu : '서초'
};
// 깊은 복사를 수행할 빈 JSON 객체를 생성
const copy = {};
for(let key in addr){
    copy[key] = addr [key];
}
console.log(addr,copy);
//addr = { city: '서울', gu: '서초' }
//copy = { city: '서울', gu: '서초' }
addr.gu = '강남';
console.log(addr,copy);
//addr = { city: '서울', gu: '강남' }
//copy = { city: '서울', gu: '서초' }

01-5. JSON, 객체의 깊은복사(2)

Obiject.assign(복사객체,원본)
복사 될 객체가 비어있을 경우 그냥 복사,
복사 될 객체 속 값이 들어있을 경우 누적하여 복사를 한다.

const copy2 = {}
Object.assign(copy2, addr);
console.log(copy2);
// copy2 = { city: '서울', gu: '강남' }
728x90

'STUDY > JavaScript' 카테고리의 다른 글

[JavaScript] 클래스 제어 classList()  (0) 2022.11.27
[JavaScript] JSON(5) 구조분해  (0) 2022.11.27
[JavaScript] JSON(3) 확장 , 반복문  (0) 2022.11.27
[JavaScript] JSON(2) - 복합자료구조  (0) 2022.11.27
[JavaScript] JSON  (0) 2022.11.27

댓글