web-dev-qa-db-ja.com

JS:Object.assign()はディープコピーまたはシャローコピーを作成しますか

私はちょうどこの概念に出くわしました

var copy = Object.assign({}, originalObject);

これにより、元のオブジェクトのコピーが「copy」オブジェクトに作成されます。しかし、私の質問は、オブジェクトのクローンを作成するこの方法でディープコピーまたはシャローコピーを作成しますか?

PS:混乱は、ディープコピーを作成する場合、オブジェクトを複製する最も簡単な方法になるということです。

35
Shivi

コピーするオブジェクトにenumerable属性がfalseに設定されたプロパティがある場合、ディープコピーは忘れてください。浅いコピーでも安全ではありません。

MDN:

Object.assign()メソッドは、列挙可能な所有プロパティをソースオブジェクトからターゲットオブジェクトにのみコピーします

この例を取ります

var o = {};

Object.defineProperty(o,'x',{enumerable: false,value : 15});

var ob={}; 
Object.assign(ob,o);

console.log(o.x); // 15
console.log(ob.x); // undefined
31
Ramanlfc

Object.assign()を使用すると、実際にはオブジェクトのShallow Copyを実行しています。あるオブジェクトを別のオブジェクトに割り当てるような操作を行うときはいつでも、実際に浅いコピーを実行します。つまり、OBJ1がオブジェクトである場合、OBJ2である別のオブジェクトを介して変更すると、OBJ1の変更も反映されます。

18
Rish

MDNのこの段落 に従って、浅いコピーを作成します。

ディープクローンの場合、Object.assign()はプロパティ値をコピーするため、他の代替手段を使用する必要があります。ソース値がオブジェクトへの参照である場合、その参照値のみをコピーします。

Reduxの目的には、Object.assign()で十分です。reduxアプリの状態には不変値(JSON)しか含まれていないためです。

8
Bihn Kim

小さい_Data structures_の場合、JSON.stringify()JSON.parse()がうまく機能することがわかります。

_// store as JSON
var copyOfWindowLocation = JSON.stringify(window.location)
console.log("JSON structure - copy:", copyOfWindowLocation)
// convert back to Javascript Object
copyOfWindowLocation = JSON.parse(copyOfWindowLocation)
console.log("Javascript structure - copy:", copyOfWindowLocation)
_
5
Marian07

他の答えは複雑です。
質問にまったく答えない人もいます。

以下は私のために働いた

// orignal object with deep keys
var originalObject = {
    k1: "v1",
    k2: "v2",
    deepObj: {
        k3: "v3",
        k4: "v4"
    }
};

// make copies now
var copy1 = JSON.parse(JSON.stringify(originalObject));
var copy2 = JSON.parse(JSON.stringify(originalObject));

お役に立てば幸いです。