JavaScript 原型(prototype)函数重写

Question

我正在使用开源Able Player来自GithubUI是非常基本的，我想知道扩展播放器和覆盖功能的最佳方法，例如

AblePlayer.prototype.getSvgData = function(button) {...
AblePlayer.prototype.setButtonImages = function() {...

这样我就可以使用自己的图标等。

没有对原始ableplayer.js进行主题化

Answer 1

最好根据 MDN 使用原型(prototype)继承最佳实践来扩展 AblePlayer

(function(){
    const AblePlayer = window.AblePlayer;

    function MyAblePlayer(...args) {
        AblePlayer.call(this, ...args);
    }

    MyAblePlayer.prototype = Object.create(AblePlayer.prototype);
    MyAblePlayer.prototype.constructor = MyAblePlayer;

    /* @override method*/
    MyAblePlayer.prototype.getSvgData = function (...args) {
        // if you need to call super do:
        const superResult = AblePlayer.prototype.getSvgData.call(this, ...args);

        // add your code here

        return superResult; // or return some other result
    }

    // Copy static properties
    Object.assign(MyAblePlayer, AblePlayer)

    // Finally override global reference
    window.AblePlayer = MyAblePlayer;
})();