Question

我正在写一些JavaScript课程（旧学校，不使用ES2015 / ES6，我不想使用Babel或其他转发器），我有一个继承自另一个，覆盖其中一个父方法。

所以我有我的初始App.Hello课程：

var App = {};
App.Hello = function(args) {
    this.name = args.name;
}
App.Hello.prototype = {
    constructor: App.Hello,
    sayHello: function() {
        console.log('Hello, ' + this.name);
    },
    sayGoodbye: function() {
        console.log('Goodbye, ', this.name);
    }
}

然后我的App.Yo类继承自它：

// inherits from App.Hello
App.Yo = function(args) {
    App.Hello.call(this, args);
}
App.Yo.prototype = Object.create(App.Hello.prototype);
App.Yo.prototype = { // want to combine this with above!
    constructor: App.Yo,
    sayHello: function() {
        console.log('Yo, ', this.name);
    }
}

但是因为我使用了对象文字结构，所以当我在设置App.Yo后传递constructor和sayHello方法时，我会覆盖Object.create的原型。所以我不会从App.Hello

继承sayGoodby方法

1。我怎样才能解决这个问题，但是使用文字结构？

我知道我可以这样做：

App.Yo.prototype = Object.create(App.Hello.prototype);
App.Yo.prototype.constructor = App.Yo;
App.Yo.prototype.sayHello = function sayHello() {
    console.log('Yo, ', this.name);
}

但是我想保留文字结构，因为我的类将会有很多不同的方法。所以想保持它的整洁。

2。是否可以将完整的类嵌套为文字？那么构造函数是否也嵌套为文字的一部分？

e.g。

App.Hello = function(args) {
    this.name = args.name;
}

和

App.Yo = function(args) {
    App.Hello.call(this, args);
}

Answer 1

如何使用文字结构来解决这个问题？

使用Object.assign，这是在ES2015中添加的，但可以进行多边形填充，因此您无需转换：

App.Yo.prototype = Object.assign(Object.create(App.Hello.prototype), {
    constructor: App.Yo,
    sayHello: function() {
        console.log('Yo, ', this.name);
    }
});

或者如果您不想进行填充，只需使用您自己的帮助程序，例如标准extend函数（jQuery有一个名为$.extend的函数，就像许多其他实用程序库一样）：< / p>

function extend(target) {
    var i, source;
    for (i = 1; i < arguments.length; ++i) {
        source = arguments[i];
        Object.keys(source).forEach(function(name) {
            target[name] = source[name];
        });
    }
    return target;
}

App.Yo.prototype = extend(Object.create(App.Hello.prototype), {
    constructor: App.Yo,
    sayHello: function() {
        console.log('Yo, ', this.name);
    }
});

是否可以将完整的类嵌套为文字？

是的，进一步了解辅助功能。例如：

function derive(base, props) {
    var cls = function() {
        return base.apply(this, arguments);
    };
    cls.prototype = Object.create(base.prototype);
    Object.assign(cls.prototype, props); // Or use your `extend` here
    return cls;
}

App.Yo = derive(App.Hello, {
    constructor: App.Yo,
    sayHello: function() {
        console.log('Yo, ', this.name);
    }
});

当然，有很多功能缺失，比如控制你在Yo使用哪些参数而不是传递给Hello。

如果你想进一步探讨这个问题，你可以看一下我的Lineage library，这使得在ES5及更早版本中创建类非常简单和声明。就我个人而言，我认为它已经过时了，因为ES2015和转换，但你已经说过你不想使用转换器...

将对象文字用于原型类

1 个答案: