如何使用 TypeScript 中的方法动态扩展类？答案

【问题标题】：How to dynamically extend class with method in TypeScript?如何使用 TypeScript 中的方法动态扩展类？
【发布时间】：2017-05-08 07:51:53
【问题描述】：

如何使用 TypeScript 中的方法动态扩展类？有什么例子吗？我试试：

UsersBlocksMyOrders.prototype.myFunc = function():any{
  alert('23434');
};

但是编译器给我一个错误。

【问题讨论】：

它给出了什么错误？
dynamically 扩展类的目的是什么？
错误：“UsersBlocksMyOrders”类型上不存在属性“myFunc”
我需要动态扩展类，因为我想给任何人使用外部 javascript 扩展来添加方法。

标签： javascript typescript inheritance prototype

【解决方案1】：

大多数情况下，您需要执行以下操作：

interface UsersBlocksMyOrders {
    myFunc(): any;
}

否则编译器不知道。

它甚至可以与现有的类一起使用。例如：

interface String {
    logit(): void;
}

String.prototype.logit = function () {
    console.log(this);
}

let a = "string";
a.logit();

(code in playground)

因为您想更改另一个模块中的某些内容，称为Module Augmentation，您需要执行以下操作：

Import { UsersBlocksMyOrders } from "../pages/users/blocks/myorders";

declare module "../pages/users/blocks/myorders" {
    interface UsersBlocksMyOrders {
        logit(): void;
    }
}

UsersBlocksMyOrders.prototype.logit = function () { console.log(this); }

只要有可能（这似乎适合您），请直接编辑源代码。这样做只能根据需要进行。

【讨论】：

这是行不通的。因为类已经存在并且与声明冲突。
我尝试：从“../pages/users/blocks/myorders”导入{ UsersBlocksMyOrders }；接口 UsersBlocksMyOrders { logit(): void; } UsersBlocksMyOrders.prototype.logit = function () { console.log(this);它说：TS:2440 导入声明与 UsersBlocksMyOrders 的本地声明冲突
检查我修改后的答案。另外，下次不要在注释中放那么多代码，因为它不可读。而是编辑您的问题并将其放在那里，然后评论说您已将其添加到问题中。

【解决方案2】：

这可能会有所帮助 (from here)：

function extend<T, U>(first: T, second: U): T & U {
    let result = <T & U>{};
    for (let id in first) {
        (<any>result)[id] = (<any>first)[id];
    }
    for (let id in second) {
        if (!result.hasOwnProperty(id)) {
            (<any>result)[id] = (<any>second)[id];
        }
    }
    return result;
}

class Person {
    constructor(public name: string) { }
}
interface Loggable {
    log(): void;
}
class ConsoleLogger implements Loggable {
    log() {
        // ...
    }
}
var jim = extend(new Person("Jim"), new ConsoleLogger());
var n = jim.name;
jim.log();

【讨论】：