为什么 Javascript 中的嵌套对象不保留它们的值

这里的问题是两个玩家共享与原型相同的Player对象。当一个玩家更改此对象中的字段时，它们也会在查看另一个对象时更改。

您可以为此使用构造函数：

// constructor function
function Player () {
  this.name = "";
  this.id = "";
  this.action = {
    action1: "",
    action2: "",
    action3: ""
  };
}
var player1 = new Player();
player1.name = " hack";
player1.id = 1;
player1.action.action1 = "aaa";
player1.action.action2 = "aaa";
player1.action.action3 = "aaa";
console.log(JSON.stringify(player1.action));
var player2 = new Player();
player2.name = " Jason";
player2.id = 2;
player2.action.action1 = "bbb";
player2.action.action2 = "bbb";
player2.action.action3 = "bbb";
console.log(JSON.stringify(player2.action));
console.log(JSON.stringify(player1.action));

调用 new Player() 时，将实例化一个新对象，并为该对象创建 name 和 id 等新属性，并且Player的多个实例不会相互冲突。

有没有更好的方法来使用方法 1 但使操作对象不被更改？

使用为您初始化 action 属性的构造函数，这样您就不必手动将其写出。你无法避免需要它们，除非你把它们放平，把.action*直接放在播放器上。

因为当你在Javascript中替换Array或Object时，Javascript会引用数组/对象而不是复制。所以当你做player1.action.action1 = "aaa";或player2.action.action1 = "bbb";时，你是在改变Player的值。由于玩家 1 或玩家 2 只是指向Player对象。

Object.create(( 方法使用指定的原型对象和属性创建一个新对象。

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/create

这意味着您正在创建一个对数组/对象具有相同引用的新对象。因为即使Player也没有 Array 作为其属性，而是对数组/对象的内存地址的引用。所以Object.create()创建的新对象也只有引用。

如果同时选中 Player 对象具有什么，则会注意到其值也发生了更改。

console.log(Player)
action:
  action1: "bbb"
  action2: "bbb"
  action3: "bbb"

为了避免这种情况。当您将对象用作原型时，您需要对其进行深度复制。

//Method 1
var Player = {
  name: "",
  id: "",
  action: {
    action1: "",
    action2: "",
    action3: ""
  }
}
objectCreate = function(obj){
    return jQuery.extend(true, {},obj)
};
var player1 = objectCreate(Player);
player1.name = " hack";
player1.id = 1;
player1.action.action1 = "aaa";
player1.action.action2 = "aaa";
player1.action.action3 = "aaa";
console.log(JSON.stringify(player1.action));
var player2 = objectCreate(Player);
player2.name = " Jason";
player2.id = 2;
player2.action.action1 = "bbb";
player2.action.action2 = "bbb";
player2.action.action3 = "bbb";
console.log(JSON.stringify(player2));
console.log(JSON.stringify(player1));
console.log(Player)

不过你需要jQuery

objectCreate = function(obj){
    return jQuery.extend(true, {},obj)
};

这为您提供了完美的深度复制对象。上面的代码按您的预期工作。

在此处查看 jQuery.extend 详细信息 http://api.jquery.com/jquery.extend/

Object.create所做的是，它将一个对象作为输入，并将其所有属性复制到新对象。现在，如果属性指向可变值，则可以使用新创建的对象对其进行更改。因此，您可以使用任何指向Player.action的值、player1.action和player2.action的引用变量来改变的值。

根据你的代码Player应该是一个类而不是一个对象。因此，我们可以使其成为构造函数(JS没有类，但有对象构造函数(，如下所示。

//New Method 1
var Player = function() {
  this.name = "";
  this.id = "";
  this.action = {
    action1: "",
    action2: "",
    action3: ""
  };
};
var player1 = new Player();  // Create a new object using `Player` constructor function
player1.name = " hack";
player1.id = 1;
player1.action.action1 = "aaa";
player1.action.action2 = "aaa";
player1.action.action3 = "aaa";
console.log(JSON.stringify(player1.action));
var player2 = new Player();  // Create another object using `Player` constructor function
player2.name = " Jason";
player2.id = 2;
player2.action.action1 = "bbb";
player2.action.action2 = "bbb";
player2.action.action3 = "bbb";
console.log(JSON.stringify(player2.action));
console.log(JSON.stringify(player1.action));

这里对象player1和player2是使用构造函数Player创建的。new 关键字实际上启动了一个新对象。在传统的 OOP 意义上，你可以说类 Player 的player1和player2对象都是使用 new 关键字创建的。

输出将是

{"name":"hack","id":1,"action":{"action1":"aaa","action2":"aaa","action3":"aaa"}} 
{"name":" Jason","id":2,"action":{"action1":"bbb","action2":"bbb","action3":"bbb"}}
{"name":" hack","id":1,"action":{"action1":"aaa","action2":"aaa","action3":"aaa"}}