我正在用 ES6 编写一个应用程序并使用 babel 进行转译。我有一系列形状的对象(正方形、矩形、梯形等)
我希望能够使其中一些对象成为“特殊”对象,例如具有双边框或圆 Angular 。但我不想子类化每个对象(即 DoubleBorderRectangle、DoubleBorderSquare)
这似乎是引入装饰器的好地方。
但是,当我想装饰使用 super 的方法时,我遇到了问题。
例如,我有一个这样的类:
class Trapezoid extends Sprite {
constructor(x, y, width, height) {
super(x, y, width, height);
this.type = "Trapezoid";
//other trapezoid specific functions here.
}
draw(ctx) {
super.draw(ctx);
//specific code for drawing trapezoid here.
}
}
现在我希望能够使用装饰器实例化一个特殊的梯形,例如带有双边框的梯形:
function doubleBorder(shape) {
shape.draw = function(ctx) {
//draw the trapezoid.
super.draw(ctx);
//double border drawing stuff here.
}
return shape;
}
并实例化:
let trapezoid = new Trapezoid(0,0,100,100);
let doubleBorderTrapezoid = doubleBorder(trapezoid);
一个问题是 babel 不喜欢在类之外使用 super。这是可以理解的。有没有一种方法可以获取形状的父类(super class)并向其传递正确的上下文,而无需创建一次性对象?
最佳答案
我知道这已经很旧了,但您可以通过多种方式实现,因此它取决于样式和代码行。
1) 在父类(super class)中创建一个函数来添加双轮廓,假设这将由多个子类使用。
2) 创建装饰器函数数组(父类(super class)或特定子类),然后在绘制(父类(super class)或子类)中检查这些函数并应用。
const myDecorator = (ctx) => { ... }
...
draw(ctx) {
this.decorators.forEach(draw => draw(ctx));
}
根据您的用例,第一个是更干净的 OOP,第二个是更多的组合功能学习。
关于javascript - 在 ES6 中包装类函数并使用 super 的直接方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39151811/