浅い放射

12013 ワード
浅い放射 ふかほうしゃ テキストリンク

オブジェクトのデフォルトはリファレンスタイプであることを知っておく必要があります.

浅い放射


:アドレス値のみコピーします.
サンプルコード)
var copyObject = function(target) {
  var result = {};
  for (var prop in target) {
    result[prop] = target[prop];
  }
  return result;
}
  • 程度のアドレス値のみがコピーされるので、指す値が1つ変更されると、残りの1つも一緒に変更される.(ソースとコピーは同じ参照データのアドレスを指します.)
    ->レプリカを交換するとオリジナルも一緒に交換され、オリジナルを交換するとレプリカも一緒に交換されます.
    • const user = {
  name : 'goo',
  urls : {
    portfolio : 'https://github.com/seonggookang',
    blog : 'https://blog.naver.com/ksung91889'
  };
};

const user2 = copyObject(user);

user2.name = 'kang'; //(1)
console.log(user.name === user2.name); // false

user.urls.portfolio = 'http://portfolio.com';
console.log(user.urls.portfolio === user2.urls.portfolio); // true

user.urls.blog = 'http://blog.com';
console.log(user.urls.blog === user2.urls.blog); // true
    (1)1行のコピーuser 2のname propertyを変更しても、元のuserのname propertyは変更されません.
    userオブジェクトに直接属するProperty(name)では、コピーされたデータは新しいものです.
    さらなるURLの内部プロパティは、既存のデータを直接参照します.
    そのため、オリジナルとコピーがずっと同じ現象が発生します.
  • を防止するために、ユーザ.urls propertyの場合も、不変オブジェクトとして作成する必要があります.この場合,深さ放射の概念が必要である.

    • ふかほうしゃ


    :値にコピーします.
  • の値にコピーするため、一方が値を変更しても他方の値は変更されません.
    • //객체의 깊은 복사를 수행하는 범용 함수
const copyObjectDeep =(target)=>{
  const result = {};
  if(typeof target === 'object' && target !== null){ //(1)
  for(let prop in target){
    result[prop] = copyObjectDeep(target[prop])
    }
  } else{
  result = target //(2)
 }
  return result
};

// (1)번째 줄에서 target !== null 조건을 덧붙인 이유는 typeof 명령어가 null에 대해서도 'object'를 반환하기 때문이다. (자바스크립트 자체 버그이다.)
    (1)ターゲットが1行目がオブジェクトである場合,copyObjectDeep関数を内部フローでループ呼び出している.
    オブジェクトでない場合は(2)targetを2行目のようにそのまま指定する.
    この関数を使用してオブジェクトをコピーすると、元のオブジェクトとコピーはまったく異なるオブジェクトを参照するため、どのPropertyを変更しても他のオブジェクトには影響しません.
    tip. 深度レプリケーションのシンプル化方法
  • JSON構文で表される文字列に変換し、JSONオブジェクトに変換します.
    • const copyObjVioJSON = (target)=>{
  return JSON.parse(JSON.stringify(target)) 
}
const obj ={
	a:1,
  	b:{
   	  c: null,
  	  d:[1,2],
     	  func1:function(){console.log(3);}      
        },
  	func2:function(){console.log(4);}
    }

const obj2 = copyObjVioJSON(obj)

obj2.a=3;
obj2.b.c=4;
obj.b.d[1]=3;

console.log(obj) //{a:1, b:{c:null, d:[1,3], func1:f()},func2:f()}
console.log(obj2) //{a:3, b:{c:4, d:[1,2], func1:f()},func2:f()}
    結合＃ケツゾク＃
    GIt問題解決