對象添加到數組所有更改爲最後添加的對象

我只是簡單地將對象添加到數組中，並且它們全部都變爲最後添加的值。這似乎很奇怪。對象添加到數組所有更改爲最後添加的對象

var _object = {x:0,y:0,z:0}; 
    var _objects = []; 

    $("div").on("mousedown", function(e) { 

     var offset = $(this).offset(); 

     _object.x = e.pageX-offset.left; 
     _object.y = e.pageY-offset.top; 

    }).on("mouseup", function(e) { 

     var offset = $(this).offset(); 

     _object.z = 25; 
     _objects.push(_object); 

    });

preview

這是發生，因爲它只是將對象的鏈接？

http://jsfiddle.net/u5wLn/

來源

2013-12-18 Kivylius

對象在JS中通過引用傳遞，您正在更新並推送相同的對象。 – elclanrs

謝謝所有幫助，這是完美的解決方案。

var _object = {x:0,y:0}; 
var _objects = []; 

$("div").on("mousedown", function(e) { 

    var offset = $(this).offset(); 

    _object.x = e.pageX-offset.left; 
    _object.y = e.pageY-offset.top; 

}).on("mouseup", function(e) { 

    var offset = $(this).offset(); 

    _object.z = 25; 
    _objects.push({ 
     x:_object.x, 
     y:_object.y, 
     y:25  
    }); 

});

來源

2013-12-18 01:04:11 Kivylius

這是因爲你修改同一個對象，每次添加相同對象的數組。要解決這個問題，你可以創建新的對象下每按一次，這樣

var offset = $(this).offset(); 
    _object = {x:0,y:0,z:0};   // We create a new object every time. 
    _object.x = e.pageX-offset.left; 
    _object.y = e.pageY-offset.top;

入住這Updated Fiddle

來源

2013-12-18 00:39:25 thefourtheye

這是因爲你改變_object相同的實例，並將其推到數組，每次你需要創建一個新的對象。

var _object, _objects = []; 

$("div").on("mousedown", function (e) { 

    var offset = $(this).offset(); 

    _object.x = e.pageX - offset.left; 
    _object.y = e.pageY - offset.top; 
    _objects.push(_object); 

}).on("mouseup", function (e) { 

    var offset = $(this).offset(); 
    _object.z = 25; 
    _objects.push(_object); 

}).mouseenter(function() { 
    _object = { 
     x: 0, 
     y: 0, 
     z: 0 
    }; 
}); 

$("button").on("click", function() { 
    console.log(_objects); 
});

演示：Fiddle

來源

2013-12-18 00:39:36

剛剛添加z而不是x，y，z。 – Kivylius

@CezarisLT查看更新 –

請使用克隆：

變化：

_objects.push(_object);

要

_objects.push(jQuery.extend(true, {}, _object));

來源

2013-12-18 00:41:58 Zac

您需要實例化一個新的對象來推到陣列。有很多方法可以做到這一點，這裏有一個：

function coorObj(obj) { 
     return { 
      x: obj.x, 
      y: obj.y, 
      z: obj.z 
     } 
    }

只要打電話，在你_objects.push(coorObj(_object));

這是你更新Fiddle

來源

2013-12-18 00:46:57 monners

對象添加到數組所有更改爲最後添加的對象

回答

相關問題