在 TypeScript 中扩展 AudioContext答案

【问题标题】：Extend AudioContext in TypeScript在 TypeScript 中扩展 AudioContext
【发布时间】：2016-08-14 11:35:17
【问题描述】：

我想扩展（以 OOP 术语）TypeScript 中的内置 AudioContext 类：

class LiveAudioContext extends AudioContext {
    constructor() {
        super();
    }

    public setPlaybackRate(rate: number) {
        console.log(`Set rate to ${rate}.`);
    }
}

这是有效的 TypeScript，编译器和 IntelliSense 都接受。然而，在运行时，我得到一个TypeError，Chrome 也为此添加了以下错误消息：

var liveCtx = new LiveAudioContext();

“AudioContext”构造失败：请使用“new”运算符，此 DOM 对象构造函数不能作为函数调用。

很公平，我知道如何解决compiled Javascript output 中的问题。但是，每次构建后都必须手动修复编译器导致的错误，这不适合生产使用。

我怎样才能正确地完成这个扩展，以便它在编译的输出中也能正常工作，并且是现成的？

编辑：当然，创建一个包装类来有效地重新定义每个方法和属性的工作原理，但我发现它闻起来很像，臭，而且很糟糕——来自架构观点：

class LiveAudioContext {
    private internalContext: AudioContext;

    public createBuffer() {
        return this.internalContext.createBuffer.apply(this.internalContext, arguments);
    }

    public createBufferSource() {
        return this.internalContext.createBufferSource.apply(this.internalContext, arguments);
    }

    ...
}

【问题讨论】：

某些内置函数不可扩展。我相信Proxy API 旨在处理此用例，但这会将您降级为更新的浏览器。

标签： typescript extend

【解决方案1】：

我相信以下问题提供了一个很好的解决方案：How to handle warnings for proprietary/custom properties of built-in objects in TypeScript

本质上是扩展现有接口，并将新方法直接应用于浏览器的对象。

【讨论】：