在一個循環中，所有的數組元素得到的最後一個

值我有以下幾點：現在在一個循環中，所有的數組元素得到的最後一個

var travel_path=[]; 
var point={ 
    "left": 0, 
    "top": 0 
}; 
while(/*some condition here*/){ 
    point.left+=3; 
    point.top+=5; 
    travel_path.push(point); 
} 
console.log(travel_path);

，如果while循環10次迭代運行，而不是在獲得的left和top的增加值每個元素，我得到10個具有相同值{"left": 30, "top": 50}的元素。

因此，即使我使用push來將元素追加到數組的末尾，它也會以某種方式更新所有以前的元素。

任何想法如何解決這個問題？

來源

2016-09-21 jovan

對象通過引用*傳遞*值，你只有一個單一的'點'對象，你繼續推動，這是你唯一要改變的對象。 – adeneo

您需要在迭代的每個步驟中創建一個新對象，然後將其推送到您的數組，現在您要推送同一個「點」變量的多個副本。 – slugo

那麼我該如何解決它？我試着添加var tmp = point;然後每次推動tmp而不是點，但結果是一樣的。 – jovan

可以在每個循環迭代與Object.assign()創建對象的副本，並推動該對象數組。

var travel_path = []; 
 
var point = { 
 
    "left": 0, 
 
    "top": 0 
 
}; 
 
var i = 0; 
 

 
while (i++ < 5) { 
 
    point.left += 3; 
 
    point.top += 5; 
 
    travel_path.push(Object.assign({}, point)); 
 
} 
 
console.log(travel_path);

來源

2016-09-21 14:01:21

這個技巧。我曾嘗試每次宣佈一個新的變種，但沒有奏效。 – jovan

這就是javascript的工作原理。你可以做這樣的：

var travel_path = []; 
var lastPoint; 
var point = { 
    "left": 0, 
    "top": 0 
}; 
while (/*some condition here*/) { 
    lastPoint = travel_path[travel_path.length-1] || point; 
    travel_path.push({ 
     left: lastPoint.left + 3, 
     top: lastPoint.top + 5 
    }); 
} 
console.log(travel_path);

來源

2016-09-21 13:58:50 Adam

這不是一個簡單的選項，因爲實際函數實際上並不僅僅是添加+3和+5，而是執行相當複雜的計算。所以我必須將整個代碼粘貼到一個單獨的函數中，並且每次調用它。一定會有更好的辦法？ – jovan

試試這個：

var travel_path=[]; 
var point={ 
    "left": 0, 
    "top": 0 
}; 
while(/*some condition here*/){ 
    point.left+=3; 
    point.top+=5; 
    var tempPoint={ 
    "left": point.left, 
    "top": point.top 
    }; 
    travel_path.push(tempPoint); 
} 
console.log(travel_path);

來源

2016-09-21 14:01:40

您可以根據自己計算出新的結果，你可以繼續計數，像point，推動tjen一個新的對象和值。

var travel_path=[]; 
var point={ 
    left: 0, 
    top: 0 
}; 
while(/*some condition here*/){ 
    point.left += 3; 
    point.top += 5; 
    travel_path.push({ left: point.left, top: point.top }); 
} 
console.log(travel_path);

來源

2016-09-21 14:03:23

在一個循環中，所有的數組元素得到的最後一個

回答

相關問題