如何在TypeScript類中擴展ES6類

Question

我有一個用ES6編寫的JavaScript類：

// MyClass.js
export default class MyClass {
  myfunction() {
    console.log('myfunction called');
  }
}

我想用TypeScript類擴展此類：

// MyTSClass.ts
import MyClass from './MyClass';

class MyTSClass extends MyClass {
  public initialize() {
    this.myfunction();
  }
}

這會產生TypeScript編譯器錯誤：

TS2339：類型“ MyTSClass”上不存在屬性“ myfunction”

我在esModuleInterop設置為true 。

我試圖制作一個聲明文件，認為這樣做可能會有所幫助：

// MyClass.d.ts
export = MyClass;

declare class MyClass {
  myfunction: void;
}

這使編譯器感到滿意，但是在瀏覽器中生成的代碼中，我看到了一些意外情況，並且控制台日志無法打印：

class MyTSClass extends WEBPACK_IMPORTED_MODULE_1__["MyClass"]...

我究竟做錯了什么？

Answer 1

很難從您提供的信息中看出來，但我將從所謂的initialize入手。 我假設您不是要使用constructor嗎？ 在Chrome中，您可以使用debugger; 語句以在代碼的特定點啟動調試器，我認為這比設置斷點要容易。 從那里，您可以單步執行代碼並查看發生了什么。 您也可以console.log類的實例來檢查其原型鏈，以確保myfunction方法在那里。