對js理解陷入了誤區。
場景問題:
今天同事問了我個問題,將一個變量改變,再放入一個數組中,發現後面的將前面的覆蓋。
<!DOCTYPE html>
<html>
<body>
<script>
var obj = {
"name":"Bill Gates",
"age":62,
"cars": {
"car1":"Porsche",
"car2":"BMW",
"car3":"Volvo"
}};
var cars = [{"car1":"11Audi", "car2":"11BMW", "car3":"11porsche"},{"car1":"22Audi", "car2":"22BMW", "car3":"22porsche"}];
// 相同名字,年齡。但是擁有的車不同。
var psersons = [];
for(let i = 0; i < cars.length; i++){
obj.cars = cars[i];
psersons.push(obj);
}
console.log(psersons);
</script>
</body>
</html>
錯誤的思維理解:
1、第一次循環,改變對象push進數組,我們第一個想要結果進去了。
1、第二次循環,改變對象push進數組,我們第二個想要結果進去了。
你想的結果:
[{ "name":"Bill Gates",
"age":62,
"cars": {"car1":"11Audi", "car2":"11BMW", "car3":"11porsche"}},
{"name":"Bill Gates",
"age":62,"cars":
{"car1":"22Audi", "car2":"22BMW", "car3":"22porsche"}}]
然而:
爲什麼?這就是對堆棧理解的錯誤。
正確理解是這樣的:確實你當前放入兩個。但是這兩個指的是同一個。也就是你把該對象放入兩邊。
所以第二次改變的時候,第一個所指的對象也改變了。
解決方式:將對象轉一下再放入。
比如:
obj.cars = cars[i];
psersons.push(JSON.parse(JSON.stringify(obj)));
原則上來說,你要你改變了他的指向都是可以的。
就要看看原型了。每個變量都有個原型。
大的來說,
對一個js或ts。this = window
如果想改變this指向就需要原型中的方法:提供了call、apply、bind這三個方法,來切換/固定this的指向。