javascript-如何在不通过引用传递对象的情况下将对象推入数组？

这个问题已经在这里有了答案：            >            What is the most efficient way to deep clone an object in JavaScript?                                    74个
所以我在一个名为“ tiles”的类中有一个属性,其中包含有关棋盘游戏状态的信息.每当我在游戏开始时做出合法举动时,我都试图将这个属性推到一个名为“ moves”的数组中.但是问题是,每当我推送新的tile属性时,moves数组中的先前元素都会更改为最新推送的tile的值.

我知道发生这种情况是因为该对象通过引用传递,因此替换了数组中的旧元素,因为它们现在指向同一对象,这是属性tile的最新值.因此,在下面给出我的代码的情况下,有没有一种方法可以推动该对象而不是通过引用,而是通过法律移动而导致的“平铺”的每个不同状态.

这是我的代码段：App.js

App = function () {
  var self = this;
  self.tiles = []; 
  // this is populated with objects from a json file
  //code to fetch json and save it to self.tiles
  //more code

  this.startGame = function () {
    //other code
    self.moves.push(self.tiles);
  };
  this.makeMove = function () {
    //other code
    self.moves.push(self.tiles);
  };
};

因此,我期望的是self.moves数组中的图块应指向不同的对象,而不是同一对象.它应该包含self.tiles的不同状态,但是现在,当我按下该属性时,“ moves”数组的元素将被最新的self.tiles值覆盖.

解决此问题的任何帮助将不胜感激.谢谢！

最佳答案

您应该使用JSON.parse(JSON.stringify())来克隆嵌套对象.可以使用Object.assign来克隆浅对象

App = function () {
  var self = this;
  self.tiles = []; 
  // this is populated with objects from a json file
  //code to fetch json and save it to self.tiles
  //more code

  this.startGame = function () {
    //other code
    self.moves.push(JSON.parse(JSON.stringify(self.tiles)));
  };
  this.makeMove = function () {
    //other code
    self.moves.push(JSON.parse(JSON.stringify(self.tiles)));
  };
};