原型继承对象的多个实例

Question

我正在尝试掌握使用原型继承的方法。这是我下面的代码。它基于 Stoyan Stefanov 的《面向对象的 Javascript》一书，仅做了一些修改。

基本上我有一个 Athlete 对象，它扩展了 Person 对象。我创建了 3 个对象。鲍勃是一个人，而比利·吉恩和史蒂夫是运动员。我按照特定的顺序添加了鲍勃、比利·吉恩和史蒂夫。我调用了 say() 和 run() 函数以及 getSpeed() 和 jump()，对于 < code>Athlete 对象，所有 3 个对象均按此特定顺序排列：Bob、Billy Jean 和 Steve。

这是下面的代码。

<script type="text/javascript">

    function clone(o) {
    var n;
    function F(){};
    F.prototype = o;
    n = new F();

    return n;

   }

    /* Uber is equivalent to the extends method */
   function uber(parent, child) {
     var n = clone(parent);
     n.uber = parent;

   for (var i in child) {
      n[i] = child[i];
   }
   return n;
}

var Person = {
   initialise: function(name)
   {   
      this.name = name;
         },
   say: function()
   {
    console.log('My name is ' + this.name + '. I am a person'); 
   },
   run: function(){
    console.log('I have run 5km');
   },
   jump: function() {
      console.log('I have jumped for joy!');
   }
 };


 var Athlete = {
     initialise: function(name,speed) {
         this.speed = speed; 
         //uber is the parent
    this.uber.initialise(name);
},
    say: function() { console.log('My name is ' + this.name + '. I am an athlete');},
    run: function() { console.log('I have run 20km'); this.jump()},
    getSpeed: function() {console.log('My Speed is: ' + this.speed + 'km Hour');}
  }


  var Athlete = uber(Person, Athlete);

  console.log("Hello, Starting Test...");
  var bob = clone(Person); 
  bob.initialise('Bob');
  bob.say();
  bob.run();

  console.log("Adding Billy Jean...");
  var billyJean = clone(Athlete);
  billyJean.initialise('Billy Jean', 15);

 console.log("Adding Steve...");
 var steve = clone(Athlete);
  steve.initialise('Steve', 25);

 console.log("Asking Billy Jean...");
 billyJean.say();
 billyJean.run();
 billyJean.getSpeed();

 console.log("Asking Steve...");
 steve.say();
 steve.run();
 steve.getSpeed();

</script>

然而，当我运行代码时，虽然我首先调用了 Billy Jean 的函数，但 Steve 的属性会弹出两次，这意味着 Steve 替换了 Billy Jean。输出如下所示。

Hello, Starting Test...
My name is Bob. I am a person
I have run 5km
Adding Billy Jean...
Adding Steve...
Asking Billy Jean...
My name is Steve. I am an athlete
I have run 20km
I have jumped for joy!
My Speed is: 15km Hour
Asking Steve Tran...
My name is Steve. I am an athlete
I have run 20km
I have jumped for joy!
My Speed is: 25km Hour

我只是想知道是否有办法将比利·吉恩和史蒂夫分开，以便我两次获得他们的详细信息而不是史蒂夫的详细信息？

如果不可能，那么我可以使用什么替代方案来解决这个问题？任何解决方案或帮助都会有很大的帮助。

Answer 1

此特定行在 Athlete.initialize 的示例中存在问题：

//uber is the parent
this.uber.initialise(name);

通过此调用，您可以在 uber 表示的对象上调用 initialize ，该对象是共享的在你的运动员中。将此更改为：

this.uber.initialize.call(this, name);

从您的实际对象（this）上调用初始化，传递附加参数。

Answer 2

这是你的问题。 “this.uber”引用了 steve 和 billyJean 之间共享的对象。对象是通过引用传递的，所以这就是发生这种情况的原因。尝试替换

this.uber.initialise(name); 

为

this.uber.initialise.call(this, name); 

（如果您不知道，“调用”和“应用”使“方法”在不同的范围内运行）。我对你的经历没有任何真实的背景，所以希望接下来的闲聊不会侮辱......但是，有一些想法。我很少看到 JavaScript 是这样做的。大多数时候，它更像是……

var bob = new Person(); 
bob.initialise('Bob');
bob.say();
bob.run();

为什么是“克隆”？您想要一种纯粹的方法吗？如果是这样，“克隆”也好不了多少——你仍然称其为“新”并施展一点魔法。纯粹的方法会更多..（请原谅 jQuery.. 的懒惰）

Object.prototype.clone = function () {
  return $.extend(true, {}, this);
};

Object.prototype.improve = function (extras) {
  var spawn = $.extend(true, {}, this, extras);
  spawn.uber = this;
  return spawn;
};

var Person = {
  initialise: function(name) {   
    this.name = name;
  },
  say: function() {
    console.log('My name is ' + this.name + '. I am a person'); 
  },
  run: function(){
    console.log('I have run 5km');
  },
  jump: function() {
console.log('I have jumped for joy!');
  }
};

var Athlete = Person.improve({
  initialise: function(name,speed) {
    this.speed = speed; 
    //uber is the parent
    this.uber.initialise.call(this, name);
  },
  say: function() { console.log('My name is ' + this.name + '. I am an athlete');},
  run: function() { console.log('I have run 20km'); this.jump()},
  getSpeed: function() {console.log('My Speed is: ' + this.speed + 'km Hour');}
});

var bob = Person.clone(); 
bob.initialise('Bob');
bob.say();
bob.run();

console.log("Adding Billy Jean...");
var billyJean = Athlete.clone();
billyJean.initialise('Billy Jean', 15);

console.log("Adding Steve...");
var steve = Athlete.clone();
steve.initialise('Steve', 25);

console.log("Asking Billy Jean...");
billyJean.say();
billyJean.run();
billyJean.getSpeed();

console.log("Asking Steve...");
steve.say();
steve.run();
steve.getSpeed();

这也同样有效。请注意，我在这里仍然使用“调用” - 这是因为原始数据是通过引用传递的。你可以撤消这个操作.. 让它通过克隆.. 但实际上，90% 的时间这都是内存和循环的浪费。

所以，这就是我最好的“纯粹”方法！我个人不喜欢这种方式，因为我将“steve”和“billyJean”视为“新”运动员 - 而不是运动员对象的克隆 - 所以我更倾向于使用一种模式，让我可以执行“steve =”新运动员（'史蒂夫'）；'

我的两分钱，希望有帮助。