浅い放射(拡散)&深い放射

オブジェクトのコピー
変数に格納すると、オブジェクト(配列を含む)にメモリのアドレス値が格納されます.
したがって、constとして宣言された変数にオブジェクトを代入しても、
オブジェクト自体を新しい値に再割り当てするのではなく、オブジェクト内の要素を置き換えることができます.

const a = { name: '철수' }
a.name = '영희'
console.log(a) // { name: '영희' }

ただし、コピー時に問題が発生します.

const a = { name: '철수' }
const b = a;
console.log(b) // { name: '철수' }
b.name = '영희'
console.log(a) // { name: '영희' }

aを変数bにコピーすると、bの名前を英姫に変更したいだけですが、aも変更されます.
アドレス値がコピーされているため、どのアドレスを置換しても同じアドレスが参照されます.
元のデータ(String、Number、Boolean、Undefind、null)の値が

参照データ(オブジェクト、アレイ、機能)でない場合、コピーされます.

浅いレプリケーション(展開)
この問題を解決するために、スプレッドシート演算子を使用してみました.
スプレッドシート演算子は、オブジェクトまたは配列内の要素を展開できます.

const child1 = {
  name: '철수',
  age: 13,
  school: '다람쥐초등학교'
}

const child2 = {
  ...child1,
  name: '영희'
}

console.log(child1) // { name: '철수', age: 13, school: '다람쥐초등학교' }
console.log(child2) // { name: '영희', age: 13, school: '다람쥐초등학교' }

新しいオブジェクトが宣言されているため、オブジェクトのプロパティを展開してこそ、英姫の変更が正しいかどうかを判断できます.
オブジェクト文字{}では、同じキー(name)の値(child 2.name="英姫")が上書きされます.

スプレッドシート演算子は、アレイにも使用できます.
アレイは、同じアレイを複数回展開できます.

const a = [1, 2, 3]
const b = [0, ...a, 4, ...a]

console.log(b) // [0, 1, 2, 3, 4, 1, 2, 3]

ただし、オブジェクトが属性の値である場合、spreadは1レベルの深さの属性のみをコピーするので、オブジェクトが属性の値である場合、コピーではなく参照されます.

const child1 = {
  name: {
    first: '김',
    last: '철수',
  },
  age: 13,
  school: '다람쥐초등학교',
}

const child2 = {
  ...child1
}

child2.name.first = '안'

console.log(child1);
/*
{
  name: { first: '안', last: '철수' },
  age: 13,
  school: '다람쥐초등학교'
}
*/

ふかほうしゃ

const child1 = {
  name: '철수',
  age: 8,
  etc: {
    school: '다람쥐초등학교',
    money: 2000,
    hobby: '수영',
  }
}

const child2 = JSON.parse(JSON.stringify(child1));

child2.etc.school = '토끼초등학교';

console.log(child1);

/*
{
  name: '철수',
  age: 8,
  etc: { school: '다람쥐초등학교', money: 2000, hobby: '수영' }
}
*/

JSON.stringgify()は、オブジェクト全体を文字列に置き換えます.
再JSON置換文字列値.parse()を使用して新しいオブジェクトを作成すると、深くコピーされます.
オブジェクトだけでなく、アレイにも適用されます.(配列->文字->配列)

は業務上遅いだけなので、この方法は使用しません.
npmのlodashをダウンロードしclonedeepメソッドを使用します.

import lodash from 'lodash';

const a = { x: { y: 1 } };
const b = lodash.cloneDeep(a);