Javascript 将对象推入数组的正确方法是什么？

我一直在尝试不同的方法将简单坐标作为对象

{x:0，y:1}

添加到数组中，可以说，如果我手动添加它们，效果会很好

但是如果我使用一个循环，结果就无法理解。生成的数组中，从循环内部推送的所有对象的值与上次推送的对象的值完全相同

function(){
  var plot = ['south','east','north','east','north'] // user input
  let records = [ // the array, with an initial object
    {x: 0, y: 0}
  ];
  var step ={ // object to modify and copy into array
    x: 0,
    y: 0,
  };
  for (var i = 0; i < plot.length; i++) {
    if (plot[i] == "north"){
      step.y++;
    }
    if (plot[i] == "east"){
      step.x++;
    }
    if (plot[i] == "south"){
      step.y--;
    }
    if (plot[i] == "west"){
      step.x--;
    }
    console.log(step.x+','+step.y); // shows that the data is correctly modified
    records.push(step);
    console.log(records.length); // shows that the object was added to the array
  }
  for (var i = 0; i < records.length; i++) {
    var newItem = records[i];
    console.log('newItem: x='+newItem.x+' y='+newItem.y);
  }
}

function（）{
var plot=[‘南’、‘东’、‘北’、‘东’、‘北’]//用户输入
let records=[//数组，带有初始对象
{x:0，y:0}
];
var step={//要修改并复制到数组中的对象
x:0,，
y:0，
};
对于（变量i=0；i

var plot=['south'，'east'，'north'，'east'，'north']//用户输入
let records=[//数组，带有初始对象
{x:0，y:0}
];
对于（变量i=0；i0？记录[i-1]。x:0，
y:i>0？记录[i-1]。y:0，
};
if（绘图[i]=“北”）{
step.y++；
}
if（图[i]=“东”）{
step.x++；
}
if（图[i]=“南”）{
步骤y-；
}
如果（图[i]=“西”）{
步骤x--；
}
console.log（step.x+'，'+step.y）；//显示数据已正确修改
记录。推送（步骤）；
console.log（records.length）；//显示对象已添加到数组中
}
控制台日志（记录）；

根据向

记录添加新对象的方向，您可以选择
x
和
y
进行更改


函数go（）{
变量图=[‘南’、‘东’、‘北’、‘东’、‘北’]，
x=0，
y=0，
记录=[{x，y}]；
对于（变量i=0；i
.as console wrapper{max height:100%！important；top:0；}
之所以发生这种情况，是因为
步骤
变量包含对对象的引用，而不是对象本身的引用，所以每次都是这样

records.push(step);

您正在将同一引用附加到同一对象。在每次迭代中，您都使用相同的引用修改相同的对象。这就是为什么
记录
数组中的所有元素都具有相同的值。为了解决此问题，您可以在每次迭代中初始化
步骤
：

for (var i = 0; i < plot.length; i++) {
    var step = { // object to modify and copy into array
        x: 0,
        y: 0,
    };
    if (plot[i] == "north") {
        step.y++;
    }
    if (plot[i] == "east") {
        step.x++;
    }
    if (plot[i] == "south") {
        step.y--;
    }
    if (plot[i] == "west") {
        step.x--;
    }
    console.log(step.x + ',' + step.y); // shows that the data is correctly modified
    records.push(step);
    console.log(records.length); // shows that the object was added to the array
}

for（变量i=0；i

也可以将对象的副本推送到阵列：

var step = { // object to modify and copy into array
    x: 0,
    y: 0,
};
for (var i = 0; i < plot.length; i++) {

    if (plot[i] == "north") {
        step.y++;
    }
    if (plot[i] == "east") {
        step.x++;
    }
    if (plot[i] == "south") {
        step.y--;
    }
    if (plot[i] == "west") {
        step.x--;
    }
    console.log(step.x + ',' + step.y); // shows that the data is correctly modified

    /* ---> */ records.push(Object.assign({}, step)); // copy the object

    console.log(records.length); // shows that the object was added to the array
}

var step={//要修改并复制到数组中的对象
x:0,，
y:0，
};
对于（变量i=0；i*/records.push（Object.assign（{}，step））；//复制对象
console.log（records.length）；//显示对象已添加到数组中
}
您需要推送
步骤的克隆，否则上一个
步骤将被覆盖


功能绘图仪（）{
var plot=[‘南’、‘东’、‘北’、‘东’、‘北’]//用户输入
let records=[//数组，带有初始对象
{x:0，y:0}
];
var step={//要修改并复制到数组中的对象
x:0,，
y:0，
};
对于（变量i=0；i