键入 jQuery 扩展

Question

其他人编写了扩展程序。它使用如下语法显示 ajax 进度事件：

$.ajax(url)
  .progress(function(e) {
    // tracking downloading
  })
  .uploadProgress(function(e) {
    // tracking uploading
    // if (e.lengthComputable) {
    //  var percentage = Math.round((e.loaded * 100) / e.total);
    //  console.log(percentage);
    //}
  });

TypeScript 抱怨说这些新方法不存在。

在我看来，我需要以某种方式将它们添加到 JQueryXHR 中，该 JQueryXHR 是在来自definitelyTyped 的 jquery.d.ts 中定义的。这是一个第三方库，我不想编辑它 - 这会干扰更新。

如何将方法添加到已在我不想编辑的文件中定义的 TypeScript 接口？

Answer 1

如何将方法添加到已在我不想编辑的文件中定义的 TypeScript 接口

TypeScript 接口是开放式的，旨在适应这一点。

只需创建一个thelib.d.ts ：

interface JQueryXHR {
  progress: any;
  uploadProgress: any;
}

更多

https://basarat.gitbooks.io/typescript/content/docs/types/ambient/interfaces.html

---

相同但更强的打字

给出的答案解决了所提出的问题，并且具有简单的优点。但是在这个领域你需要做得更好。这里有更强的打字。如果您想要“流利”，例如 .then().fail().done() 等，这很重要。

interface JQueryXHR {
  progress<R>(callback: (e: ProgressEvent, status: string) => R): JQueryPromise<R>;
  uploadProgress<R>(callback: (e: ProgressEvent, status: string) => R): JQueryPromise<R>;
}

您不需要三斜杠引用。大概是因为 JQueryPromise 在 JQueryXHR 的主要定义范围内。