JavaScript deep & shallow copy

기본 타입의 복사

기본 타입(primitive)인 number, string, boolean, Null, Undefined, NaN는 복사가 된다. 기본 타입이 아니면 복사가 되지 않으며 참조만 된다.

 

(1) number

let num00 = 10;

let num01 = num00;

num00 += 5;

console.log(num00); // 15

console.log(num01); // 10

let num01 = num00; 이라고 할당한 시점에서 num01에는 num00에 최초 할당했던 10의 깊은 복사(deep copy)가 이루어지기에, 별개의 개체가 된다. 따라서 그 후에 num00에 5를 더해도 num00의 값이 바뀔 뿐, num01은 값은 변화하지 않는다.

 

 

(2) string

let txt00 = "테스트용 텍스트";

let txt01 = txt00;

txt00 = "변경된 텍스트";

console.log(txt00); // 변경된 텍스트

console.log(txt01); // 테스트용 텍스트

 

 

(3) boolean

let trueFalse00 = false;

let trueFalse01 = trueFalse00;

trueFalse00 = true;

console.log(trueFalse00); // true

console.log(trueFalse01); // false

 

 

(4) null

let exist00 = null;

let exist01 = exist00;

exist00 = 10;

console.log(exist00); // 10

console.log(exist01); // null

 

 

(5) undefined

let exist00;

let exist01 = exist00;

exist00 = "테스트";

console.log(exist00); // 테스트

console.log(exist01); // undefined

 

 

(6) NaN

let exist00 = NaN;

let exist01 = exist00;

exist00 = 999;

console.log(exist00); // 999

console.log(exist01); // NaN

 

 

 

 

 

얕은 복사(shallow copy)와 깊은 복사(deep copy)

(1) Shallow Copy

const animals = ["lion", "tiger", "rabbit"];

const shallowCopyAnimals = animals;

animals.push("dog");

console.log(animals); // [ 'lion', 'tiger', 'rabbit', 'dog' ]

console.log(shallowCopyAnimals); // [ 'lion', 'tiger', 'rabbit', 'dog'  ]

 

 

(2) Deep Copy

const animals = ["lion", "tiger", "rabbit"];

const deepCopyAnimals = animals.map(function (item, idx) {

  return item;

});

animals.push("dog");

console.log(animals); // [ 'lion', 'tiger', 'rabbit', 'dog' ]

console.log(deepCopyAnimals); // [ 'lion', 'tiger', 'rabbit' ]