覆盖方法的 JavaScript 原型调用基方法

javascript prototype overriding a method calls the base method

本文关键字:方法 调用 原型 JavaScript 覆盖      更新时间:2023-09-26

>我有三个对象相互扩展。基地 -> A ->子 A。它们在原型中都有方法测试。当我调用 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;

这不是你在 JavaScript 中使用构造函数进行原型继承的方式(它根本不是继承,只是在实例之间复制方法)。使用任何标准继承模式,您都会得到正确的test

下面是一个示例:

// 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();
<!-- 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>

如果你打算用构造函数做很多这样的继承,你可能会对我的帮助程序脚本Lineage感兴趣,它使事情更加简洁和包含,并简化了"超级调用"(链接到方法的父版本)。但是,当然,该脚本很快就会因ES6的class功能而过时。