Question

我有三个物体相互延伸。基地 - ＆gt; A - ＆gt; childA。他们都在原型中进行了方法测试。当我调用A.test或childA.test时，调用Base.test。我想知道每个对象调用自己的方法的选项是什么。这是代码：

$(document).ready(function(){

    function Base(){

    };

    Base.prototype.test = function(){
         console.log("base");   
    };

    function A(){

    };

    A.prototype.test = function(){
        console.log("A");   
    };

    function ChildA(){

    };

    ChildA.prototype.test = function(){
        console.log("ChildA");   
    };

    var base = new Base();

    var a = new A();

    var childA = new ChildA();

    $.extend( a, base );

    $.extend( childA, a );

    a.test();

    childA.test();
}
);

和小提琴：http://jsfiddle.net/pjWjy/84/

所以当我致电base.test - > log base; a.test -> log a; childA -> log childA;

时

Answer 1

你并不是真的如何使用JavaScript中的构造函数进行原型继承（它根本不是继承，只是在实例之间复制方法）。使用任何标准继承模式，您都可以获得正确的test。

以下是一个例子：

＆＃13;

// On old browsers like IE8, we need to shim Object.create
if (!Object.create) {
  Object.create = function(proto, props) {
    if (typeof props !== "undefined") {
      throw "The second argument of Object.create cannot be polyfilled";
    }
    function ctor() { }
    ctor.prototype = proto;
    return new ctor();
  };
}

// Define our Base constructor
function Base() {
}

// Define Base#test
Base.prototype.test = function() {
  snippet.log("Base#test");
};

// Derive A from Base
function A() {
  Base.call(this);
}
A.prototype = Object.create(Base.prototype);
A.prototype.constructor = A;

// Define A#test
A.prototype.test = function() {
  snippet.log("A#test");
};

// Derive ChildA from A
function ChildA() {
  A.call(this);
}
ChildA.prototype = Object.create(A.prototype);
ChildA.prototype.constructor = ChildA;

// Define ChildA#test
ChildA.prototype.test = function() {
  snippet.log("ChildA#test");
};

// Run
var b = new Base();
b.test();
var a = new A();
a.test();
var ca = new ChildA();
ca.test();

＆＃13;

<!-- Script provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>

＆＃13;

如果您要使用构造函数执行大量此类继承，您可能会对我的帮助脚本Lineage感兴趣，这使得事情更加简洁和完善，并简化了＆＃34; supercalls＆＃34; （链接到父方法的方法版本）。但是，当然，ES6的class功能很快就会过时。

覆盖方法的javascript原型调用基本方法

1 个答案: