为什么该对象返回相同的设置？

Question

I have a Game class that initializes player objects. I'm initializing two players p1 and p2 . Yet when I console log them, they return the same settings, even though I'm setting p2 's color to #000 .

What's the problem?

I've tried this.p1.color and this.p1['color']

var Game = {
players: 2,
p1: {},
p2: {},
currentPlayer: 1,

initPlayers: function(){
    this.p1 = Player;
    this.p2 = Player;
    this.p1.credits = 500;
    this.p2.credits = 800;
    this.p1['color'] = '#3e3e3e';
    this.p2['color'] = '#000';
    console.log(this.p1);
    console.log(this.p2);
}

}

 var g = Game;
 g.initPlayers();

Console.log is showing

 Object {credits: 800, moves: Array[0], color:'#000', getMoves: function, checkPlayer: function, enterMove: function…}
 Object {credits: 800, moves: Array[0], color:'#000', getMoves: function, checkPlayer: function, enterMove: function…}

Even though I'm setting them separately above.

Clearly the setting of the values is working, both with brackets and dot notation, however, it's as if only the final values make it. And copy to both p1 and p2 .

Am I missing something super obvious?

Answer 1

When you set

this.p1 = Player;
this.p2 = Player;

You make both variables hold the same object. I'm not sure of what you want so here are two hypothesis :

1) If you want to have separate copies of the Player object, you should clone them, for example like this (for a non deep cloning) :

this.p1 = {};
this.p2 = {};
for (var k in Player) {
   this.p1[k] = Player[k];
   this.p2[k] = Player[k];
}

2) If Player is a class, as the capitalized name would suggest, then what you need is an instanciation, which is done using new :

this.p1 = new Player();
this.p2 = new Player();

Answer 2

In JavaScript when you assigning something to an object (eg this.p1 = Player ), you don't create new object, but only link to the existing one. You'll need to create a fresh object, using Player as prototype:

this.p1 = Object.create(Player);
this.p2 = Object.create(Player);

Similarly, when you create new game you, better use Object.create() if you want to have more than one:

var g = Object.create(Game);