JavaScript原型功能覆蓋

Question

我正在使用Github的開放源代碼Able Player 用戶界面非常基本，我想知道擴展播放器並覆蓋諸如

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

這樣我就可以使用自己的圖標等。

沒有裝飾原始的ableplayer.js

Answer 1

最好根據MDN擴展具有原型繼承最佳實踐的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;
})();