javascript配列を変更して配列にプッシュすると、配列のすべての要素にコピーされます。

Question

javascript配列内のすべての要素に変更された値がコピーされている理由を理解できません。誰かがなぜそのコンセプトを説明できますか？上記のコードリターンの

var obj = {x:12}; 

var arr =[]; 

for(var i=0;i<5;i++){ 
    obj["x"] = i; 
    arr.push(obj); 
    println("Inside -> " + JSON.stringify(arr)); 
} 
println("Output -> " + JSON.stringify(arr)); 

出力 -

Inside -> [{"x":0}] 
Inside -> [{"x":1},{"x":1}] 
Inside -> [{"x":2},{"x":2},{"x":2}] 
Inside -> [{"x":3},{"x":3},{"x":3},{"x":3}] 
Inside -> [{"x":4},{"x":4},{"x":4},{"x":4},{"x":4}] 


Output -> [{"x":4},{"x":4},{"x":4},{"x":4},{"x":4}] 

Answer 1

あなたは元のObjectの参照を配列にプッシュします。 参照オブジェクトの値を変更することによって、元のオブジェクトに対しても行うことができます。

クローンする必要がないようにするには。

const clone = Object.assign({}, obj) 

例：あなたのコードで

var obj = { 
 
    x: 12 
 
}; 
 

 
var arr = []; 
 

 
for (var i = 0; i < 5; i++) { 
 
    const clone = Object.assign({}, obj); 
 
    clone["x"] = i; 
 
    arr.push(clone); 
 
    println("Inside -> " + JSON.stringify(arr)); 
 
} 
 
println("Output -> " + JSON.stringify(arr)); 
 

 
function println(x) { 
 
    console.log(x); 
 
}

Object.assign (MDN)

Answer 2

複素値（すなわち、オブジェクト）参照によって渡されます。

各繰り返しで、同じオブジェクトで作業するだけです。あなたはそれを変更すると 、修正があなたのarr

var foo = { foo: 'bar' } 
 

 
// you assume we are gonna copy the value of `foo` to `foo2` 
 
var foo2 = foo 
 

 
// change the value of the original object 
 
foo.foo = 'baz' 
 

 
// the change reflects to the other object, 
 
// since it refers back to the original object 
 
console.log(foo2) 
 

 
// ..so we didn't copy, we just referred to it

Answer 3

中にすでに存在するすべての合格参照に反映起こっているので、あなたは配列にオブジェクトを推進しているとき、あなたがしているためです事実、オブジェクトへの参照をプッシュします。

arr.push(obj); 

は、だから、それだけで一つの場所に変更したオブジェクト内の任意の値を変更すると、しかし実際には、あなたの配列の内容は、同じオブジェクトを参照しています。これを避けるために、あなたも、あなたがobjへの参照をプッシュしているので、あなたが同じオブジェクトを使用してpushを作るたびので、あなたは基本的にそれのインスタンスを複製し、あなたの配列、

arr.push(JSON.parse(JSON.stringify(obj))); 

Answer 4

にデータをプッシュするためにこれを行うことができます

for (var i = 0; i < 5; i++) { 
    A = i; 
    arr.push(A); 
} 

だからあなたは5つの等しいオブジェクトインスタンスとの合計をプッシュします...

は、あなたが何をやっているオブジェクトAがある持っている想像：あなたは1つのインスタンスを変更したときにそれらのすべてが値を変更しますy OUの変更1それらのすべての代わりに、あなたのようなアプローチを使用する必要があり、値を変更します：だからたびに、新しいオブジェクトを作成し、結果はとなります

for (var i = 0; i < 5; i++) { 
    arr.push({ x: i }); 
} 

：

[{x:1},{x:2},{x:3},{x:4},{x:5}]

Answer 5

あなたは、アレイ内のすべてのインデックスに同じオブジェクトを推進しています。Object.assignを使用してオブジェクトをコピーし、それぞれを各インデックスにコピーすることができます。

var obj = {x:12}; 
 

 
var arr =[]; 
 

 
for(var i=0;i<5;i++){ 
 
    let objCopy = Object.assign({}, obj); 
 
    objCopy["x"] = i; 
 
    arr.push(objCopy); 
 
    console.log("Inside -> " + JSON.stringify(arr)); 
 
} 
 
console.log("Output -> " + JSON.stringify(arr));

Answer 6

代わり

obj.x = i; 
arr.push(obj); 

のやる

var objCopy = Object.assign({}, obj, {x: i}) 
arr.push(objCopy);