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”

我在tsconfig中将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方法在那里。

如何在TypeScript类中扩展ES6类

1 个答案: