为 jquery 扩展编写 typescript 类型定义

Posted 2023-03-13

【中文标题】为 jquery 扩展编写 typescript 类型定义

【英文标题】：Writing typescript type defintions for jquery extensions

【发布时间】：2019-02-12 16:19:52

【问题描述】：

我有一些用 javascript 编写的 jquery 扩展。它们的访问方式如下：

var myNumber = $.myStaticFunction(myString);    
var myObject = $('selector').myElementFunction(myString);

要在打字稿部分使用此功能，我可以更改 jQuery 的 index.d.ts：

interface JQuery<TElement extends Node = htmlElement> extends Iterable<TElement> 

  ...
  myElementFunction: (sr:string) => foo:number, bar:string;
  ...

interface JQueryStatic<TElement extends Node = HTMLElement>         
  ...
  myStaticFunction: (sr:string) => number;
  ...

所以我知道这是直接更改 index.d.ts 的最丑陋的方法！我想我必须写一个单独的 myextension.d.ts。我要如何编写 jquery 扩展的定义文件？

【参考方案1】：

您不需要更改现有的定义文件。打字稿支持interface mering。您可以只定义您的 myextension.d.ts 并使用 /// 引用。

// myextension.d.ts
interface JQuery<TElement extends Node = HTMLElement> extends Iterable<TElement> 
    myElementFunction: (sr: string) =>  foo: number, bar: string ;


interface JQueryStatic<TElement extends Node = HTMLElement> 
    myStaticFunction: (sr: string) => number;



//usage.ts
/// <reference path="myextension.d.ts" />
var myNumber = $.myStaticFunction("myString");    
var myObject = $('selector').myElementFunction("myString");