javascript文件的打字稿声明

Question

我正在使用一个混合了 javascript 和 typescript 的项目。 可以使用 - declare module 轻松创建模块的声明文件。但是如何为当前文件夹中的 javascript 文件创建声明？

前 -

player.js -
var Player = function() {};
Player.prototype.validate = function() {};

如何创建声明以便可以在 typescript 中扩展它。我想做这样的事情-

player.ts -
let Player = require('./player');
Player.prototype.login = function() {
    this.validate();
}

我知道上面的代码可以通过将 Player type 设置为 any 来工作，但我无法进行类型检查。

Answer 1

您可以在 TypeScript 文件中创建界面并将其设置为 Player 的类型。

interface IPlayer {
  validate();
}

let Player: IPlayer = require('./player');

Player.prototype.login = function() {
    this.validate();
}

Answer 2

在这里扩展 Sabbir 的答案（cmets 中没有足够的空间）

interface IPlayer { 
  validate(): void
  login():void
}

旧js代码

var Player = function () { }
Player.prototype.validate = function() {}

在ts项目中使用

// import / require here, left out for brevity
Player.prototype.login = function() {
    this.validate()
}

创建播放器 - 登录和验证现在具有自动完成功能

let p: IPlayer = new Player()
p.login()
p.validate()

Answer 3

TypeScript 不理解原型语法/构造函数：不会有智能感知。它更喜欢 ES6 类。

JavaScript Player 构造函数等价于这个 TypeScript 类定义：

// -- player.d.ts --
declare class Player {
  validate(): void;
}

然后，要向Player 类添加方法，有几个选项：

1. 更多的 TypeScript 惯用方式：类继承或类组合
2. 在 TypeScript 中继续使用原型语法并仍然获得智能感知的折衷方案：外观接口

代码示例：

// -- authenticated-player.ts --
import { Player } from './player'; 

// Option #1a: class inheritance
class AuthenticablePlayer extends Player {
  login() {
    this.validate();
  }
}

const p1a = new AuthenticablePlayer();
p1a.login();

// Option #1b: class composition + delegation
class AuthenticablePlayerB {
  private player = new Player(); 

  login() {
    this.validate();
  }

  validate() {
    this.player.validate();
  }
}

const p1b = new AuthenticablePlayerB();
p1b.login();

--

// Option #2: prototype extension + facade interface + type assertion
const Player: any = require('./player');

Player.prototype.login = function() {
  this.validate();
}

interface IPlayer {
  login(): void;
  validate(): void;
}

function createPlayer(): IPlayer {
  return new Player();
}

const p2 = createPlayer();
p2.login();