Question

我试图覆盖库中的特定功能。就我而言，我试图覆盖Framework7上的某些功能。该库只有一个名为Framework7的类，在非ES6 javascript中，创建应用程序实例将如下所示：

var app = new Framework7();

所以我认为它是可扩展的，所以在这里我的代码扩展它：

export class Application extends Framework7 {
    constructor(options) {
        super(options);
    }
}

代码运行正常但是，当我尝试覆盖其中一个函数时，假设showPreloader，函数本身永远不会被调用

export class Application extends Framework7 {
    constructor(options) {
        super(options);
    }

    showPreloader(title) {
        console.log('this not printed :(');
        super(title); // this is not called as well

        // but showPreloader() from Framework7 still called
    }
}

我也尝试了不同的方法来覆盖它，我带来了这样的解决方案：

export class Application extends Framework7 {
    constructor(options) {
        super(options);

        this.showPreloader = (title) => {
            console.log('print me!'); // printed! :D
            super(); // oh, wait! cannot call super from here! :(
        }
    }
}

然而，它看起来有点难看，我不能从那里打电话给超级。

是否有任何解决方法，所以我可以从库中覆盖一个函数并通过super（或任何东西？）调用基本函数

Answer 1

我认为它是可扩展的

唐＆＃39;吨。阅读文档，询问作者，或自己阅读源代码。

在您的情况下，您选择的图书馆并未完全遵循最佳做法，只是直接在installs its methods上app "instance"。它是factory function，而不是构造函数。

有没有解决方法，所以我可以从库中覆盖一个函数并调用基函数？

是的，通过在覆盖变量之前将原始方法存储在变量中。然后，您可以使用.call(this)调用它（就像在ES5中完成继承一样）。

…
    const original = this.showPreloader;
    this.showPreloader = (title) => {
        console.log('print me!'); // printed! :D
        original.call(this, title);
    }

但是，这并不好玩，特别是因为它不仅仅是一些特定于实例的方法，而是实际上所有这些方法。因此，您最好放弃ES6 class语法和＆＃34;子类化＆＃34;在这里，改为使用寄生继承方法：

function MyFramework7(options) {
    const app = new Framework7(options);
    const {showPreloader, …} = app; // all the original methods
    … // mess with the object to your liking
    return app;
}

或许你甚至不需要将它包装在一个函数中，因为app我认为是单身。

在es6

1 个答案: