Question

您好我在使用对象文字语法声明对象原型时如何进行继承有问题。

我已经制作了两个小提琴来帮助你。

这是我的基类，几乎所有对象都是以这种方式在我的应用程序中定义的：

Base = function(param){
    this.init(param);
}
Base.prototype = {
    init: function(param){
        this.param = param;
    },
    calc: function(){
        var result = this.param * 10;
        document.write("Result from calc in Base: " + result + "<br/>");
    },
    calcB: function(){
        var result = this.param * 20;
        document.write("Result from calcB in Base: " + result+ "<br/>");
    }
}

这是我在Base中扩展和覆盖方法的成功方法：

Extend = function(param){
    this.init(param);
}
Extend.prototype = new Base();

Extend.prototype.calc = function(){
    var result = this.param * 50;
    document.write("Result from calc in Extend: " + result+ "<br/>");
}

但是我想使用与应用程序其余部分相同的样式，所以我开始玩对象文字但是它让我疯狂地对eclipse和firebug以及对我的语法的无意义响应感到高兴。

现在讨论如何将成功的扩展代码转换为对象文字样式的问题？这是许多尝试之一（它不会编译，但会让你大致了解我希望代码看起来像。）

Extend = function(param){
    this.init(param);
}
Extend.prototype = {
    : new Base(),
    calc: function(){
        var result = this.param * 50;
        document.write("Result from calc in Extend: " + result+ "<br/>");
    }
}

Answer 1

你想要Object.make。 Live Example

Extend = function(param){
    this.init(param);
}
Extend.prototype = Object.make(Base.prototype, {
    constructor: Extend,
    calc: function(){
        var result = this.param * 50;
        document.write("Result from calc in Extend: " + result+ "<br/>");
    }
});

如果您希望符合ES5标准的Object.make实现插入代码，请使用

Object.make = function make (proto) {
    var o = Object.create(proto);
    var args = [].slice.call(arguments, 1);
    args.forEach(function (obj) {
        Object.getOwnPropertyNames(obj).forEach(function (key) {
            o[key] = obj[key];
        });
    });
    return o;
}

Answer 2

您需要扩展原始原型，而不是将新对象指定为原型。

function extend(original, extension) {
  for (var key in extension) {
    if (extension.hasOwnProperty(key)) {
      original[key] = extension[key];
    }
  }
};

var A = function () {};
var B = function () {};
B.prototype = new A();
extend(B.prototype, {
   methodName: function () {}
});

如何使用JavaScript对象文字进行继承？

2 个答案: