Javascript：从父（超级？）函数调用子函数。答案

【问题标题】：Javascript: Calling child function from parent (super?) function.Javascript：从父（超级？）函数调用子函数。
【发布时间】：2013-10-01 21:26:12
【问题描述】：

两个父函数都被子函数覆盖。孩子的二号叫父母的二号。但是，我期望在父级调用 one 会调用子级的方法。有没有我遗漏的概念？

提前感谢您！

http://jsfiddle.net/9mbGN/

function parent(){}

parent.prototype.one = function(){
    $('body').append("Parent: one <br/>");
}

parent.prototype.two = function(){
    this.one();
    $('body').append("Parent: two <br/>");
}


function child(){}

child.prototype = new parent();
child.prototype.constructor = child;

child.prototype.one = function(){ //should this function not be called? 
    $('body').append('Child: one <br />');
}

child.prototype.two = function(){
    $('body').append('Child: do some child stuff here and call parent: <br />');
    parent.prototype.two();    
}



var k = new child();
k.two();

【问题讨论】：

this.one() 在您孩子的two() 中调用parent.prototype.one()，因为this 是parent.prototype
有没有办法调用child.prototype.one？
只需致电child.prototype.one() 吗？我不确定你实际上想要做什么。这一切是为了什么？
但这不违背继承的目的吗？
为什么不简单地parent.prototype.two.call(this) ？

标签： javascript inheritance prototype-programming

【解决方案1】：

嗯，我明白你想要什么... 像这样定义你的功能：

child.prototype.two = (function(){
if(child.prototype.two){
   var tmp = child.prototype.two;
   return function(){
   $('body').append('Child: do some child stuff here and call parent: <br />');   
   tmp.apply(this,arguments);
   };
  }
})()

如果原型上没有定义相同的函数，你可以添加 else 条件来返回一个函数。

【讨论】：

【解决方案2】：

由slebetman回答：

parent.prototype.two.call(this)

而不是直接调用父级的两个函数。

【讨论】：

【解决方案3】：

更优化的方式几乎就像你正在做的那样，但是你通过this调用父方法：

child.prototype.two = function(arg1, arg2) {
  parent.prototype.two.call(this, arg1, arg2);
};

但我建议你使用自定义函数来扩展，你可以使用extend from jsbase

如果您使用 ECMAScript 5 getter/setter（如果不只使用第一个），您可能更喜欢使用 this gist

根据 Dean Edward 的想法，两者都可以使用相同的方式：

var Animal = extend(Object, {

  constructor: function(name) {
    // Invoke Object's constructor
    this.base();

    this.name = name;

    // Log creation
    console.log('New animal named ' + name);
  },

  // Abstract
  makeSound: function() {
    console.log(this.name + ' is going to make a sound :)');
  },

});

var Dog = Animal.extend({

  constructor: function(name) {
    // Invoke Animals's constructor
    this.base(name);

    // Log creation
    console.log('Dog instanciation');
  },

  bark: function() {
    console.log('WOF!!!');
  },

  makeSound: function() {
    this.base();
    this.bark();
  }
});

var pet = new Dog('buddy');
// New animal named buddy
// Dog instanciation
pet.makeSound();
// buddy is going to make a sound :)
// WOF!!!

在你的情况下，它可以是：

var parent = extend(Object, {
  one: function() {
    $('body').append("Parent: one <br/>");
  },
  two: function() {
    this.one();
    $('body').append("Parent: two <br/>");
  }
});

var child = parent.extend({
  one: function() {
    $('body').append('Child: one <br />');
  },
  two: function() {
    $('body').append('Child: do some child stuff here and call parent: <br />');
    this.base();
  }
});

【讨论】：