TypeScript如何从类实例扩展类？非extends方式类型报错解决

问题场景 #

开发浏览器扩展时，无法直接访问Vehicle类，仅能获取其实例，希望不使用extends关键字让Car类拥有Vehicle的全部能力。代码运行时可正常输出"Steering"和"Honking"，但TypeScript抛出静态类型错误：

Class 'Car' incorrectly implements interface 'ICar'.
Type 'Car' is missing the following properties from type 'ICar': steer, accelerate, brake

原始代码 #

interface IVehicle {
    steer(): void;
    accelerate(): void;
    brake(): void;
}

interface ICar extends IVehicle {
    honk(): void;
}

class Vehicle implements IVehicle {
    constructor(){
        console.log("Vehicle created");
    }
    steer(): void {
        console.log("Steering");
    }
    accelerate(): void {
        console.log("Accelerating");
    }
    brake(): void {
        console.log("Braking");
    }
}

class Car implements ICar {
    constructor(veh: IVehicle){
        Object.setPrototypeOf(this, Object.getPrototypeOf(veh));
        Object.assign(this, veh);
        // 即使添加了上述两行，TS仍提示缺少steer、accelerate、brake方法
    }
    honk(): void {
        console.log("Honking");
    }
}

const veh = new Vehicle();
const car = new Car(veh);

console.log(car.steer());
console.log(car.honk());

原因分析 #

TypeScript的静态类型检查不会追踪构造函数内的动态原型修改和对象属性拷贝操作，它仅基于类的静态声明判断是否满足接口要求。因此即使运行时Car实例通过Object.assign和原型继承获得了IVehicle的方法，TS仍认为Car类未实现ICar接口的全部成员。

解决方案 #

方案1：显式声明接口要求的成员

在Car类中添加steer、accelerate、brake的类型声明，告诉TypeScript这些成员会在构造函数中被赋值：

class Car implements ICar {
    // 用感叹号(!)告诉TS这些属性会在构造函数中初始化
    steer!: () => void;
    accelerate!: () => void;
    brake!: () => void;

    constructor(veh: IVehicle){
        Object.setPrototypeOf(this, Object.getPrototypeOf(veh));
        Object.assign(this, veh);
    }
    honk(): void {
        console.log("Honking");
    }
}

方案2：实例创建时使用类型断言

如果不想修改Car类的声明，可以在创建实例时通过类型断言强制指定类型：

const car = new Car(veh) as ICar;

注意：这种方式会跳过TS的类型检查，若构造函数内的逻辑出错，运行时可能出现未定义方法的问题，需谨慎使用。

方案3：改用工厂函数创建实例

通过工厂函数封装实例创建逻辑，让TypeScript能正确推断返回值类型：

function createCar(veh: IVehicle): ICar {
    const carBase = {
        honk(): void {
            console.log("Honking");
        }
    };
    Object.setPrototypeOf(carBase, Object.getPrototypeOf(veh));
    Object.assign(carBase, veh);
    return carBase as ICar;
}

const veh = new Vehicle();
const car = createCar(veh);

内容的提问来源于stack exchange，提问作者Alex Mortez