如何在 typescript 中通過類型安全來增強“this”

Question

此代碼在香草 javascript 中運行良好

const enhancementA = {
    a() {
        return this.c + 1;
    },
};

const enhancementB = {
    b() {
        return this.c + 2;
    },
};

class C {
    c = 0;
    constructor() {
        Object.assign(this, enhancementA, enhancementB);
    }
}

const d = new C();

d.a() // 1
d.b() // 2
d.c // 0

但它在 typescript 中不起作用

d.a() // TS2339: Property 'a' does not exist on type 'C'.
d.b() // TS2339: Property 'b' does not exist on type 'C'.

我怎樣才能讓它在 typescript 中工作？

Answer 1

我不認為 C class 可以保持原樣，因為動態添加了enhancementA和enhancementB ，它們在 C 上不存在，支持構造函數（不能從類型返回到實例上） . 我會制作一個 function ，它返回一個 object 並結合增強功能。

類型參數可用於指示this必須是具有數字c屬性的 object。

const enhancementA = {
    a<T extends { c: number }>(this: T) {
        return this.c + 1;
    },
};

const enhancementB = {
    b<T extends { c: number }>(this: T) {
        return this.c + 2;
    },
};

const makeC = () => {
    return {
        c: 0,
        ...enhancementA,
        ...enhancementB
    };
};

const d = makeC();

d.a() // 1
d.b() // 2
d.c // 0

這將產生一個類型為 object

{
    b<T extends { c: number; }>(this: T): number;
    a<T extends { c: number; }>(this: T): number;
    c: number;
}