Javascript Typescript：向现有抽象类添加额外重载

我正在为包传单.Editable为DefinitelyTyped开发一套定义。该手册值得注意的是，它使用了一个部分自定义的类实现，以允许在纯JavaScript中扩展现有类型。只需在代码中的任意位置调用

import“传单.可编辑”

即可为现有传单类添加新功能，例如启用和禁用某些层的编辑功能

它不是在TypeScript中实现的，因此类型是在@types/传单中实现的，因此我正在开发的包（@types/传单可编辑）必须导入传单名称空间并扩展现有类型

我必须扩展现有类型而不是添加新类型，因为还有其他库（如react传单）使用这些类型

例如，通过扩展

映射选项

类型（by），我能够向

反应传单

的

映射组件

组件添加新属性，因为它的道具扩展了

传单.MapOptions

。如果我要创建一个新类型，

EditableMapOptions

，它将不会被

react-shallet

扩展，因此我将无法将这些属性添加到

MapComponent

我能够扩展几个现有接口，并添加新接口，如

VertexEventHandlerFn

（它表示提供

VertexEvent

的事件回调）

问题是

@types/mobile

如何实现

map.on（'click'，（event:mobileEvent）=>{}）函数。以下是一段来自：

导出抽象类事件扩展类{
/**
*将侦听器函数（fn）添加到对象的特定事件类型。
*您可以选择指定侦听器（对象）的上下文
*关键字将指向）。您还可以传递几个空格分隔的类型
*（例如“单击dblclick”）。
*/
//tslint:禁用：统一签名
on（类型：string，fn:传单事件句柄fn，上下文？：any）：此；
在（键入：“baselayerchange”|“overlayadd”|“overlayeremove”，
fn:LayersControlEventHandlerFn，上下文？：any）：这；
在（键入：“layerAd”|“layerremove”，
fn:layerventhandlerfn，上下文？：any）：这个；
...

如您所见，它使用了一个抽象类，当用户包含由空格分隔的多个事件时，它实现了一个通用定义；当提供了特定参数时，它还使用了几个特定事件，这些特定事件包括其事件处理程序的正确类型

我想将我的函数添加到此中，但我找不到任何方法向现有的抽象类添加额外的重载。这里要注意的是，

上的

的所有这些重载都是由传单中的同一行代码实现的，因此，向抽象类添加新方法所面临的问题（这将在以后由相关的JavaScript实现）这里不存在

我试图简单地重新声明
抽象类events
，向其添加更多方法，但TypeScript告诉我它已经定义。我的研究只发现TypeScript文档表明我应该使用mixin，我不能这样做，因为我需要修改现有类，而创建一个新类并不能解决问题问题

从中可能不清楚，但如果要合并到命名的
类的实例类型中，可以在编写
类Foo{}时，通过向
接口添加与
类同名的
，它将名为
Foo
的类型视为一个接口，您可以合并到其中。例如：

import { Draggable, LeafletEvent } from 'leaflet';

interface PeanutButterEvent extends LeafletEvent {
  chunky: boolean
}

declare module 'leaflet' {
  interface Evented {
    on(type: "peanut-butter", fn: (x: PeanutButterEvent) => void): this;
  }
}

const draggable = new Draggable(new HTMLElement()) // whatever
draggable.on("peanut-butter", e => console.log(e.chunky ? "Chunky" : "Creamy")); // ok
draggable.on("resize", e => console.log(e.oldSize)); // still works

import { Draggable, Evented } from 'leaflet';

declare module 'leaflet' {
  namespace Evented {
    export function hello(): void;
  }
}
Evented.hello = () => console.log("hello"); // implement if you want
Draggable.hello(); // okay
Draggable.mergeOptions({}); // still works

在这里，我在名为
events
的
接口中添加了另一个重载
on（）


另一方面，如果要合并到
类
的静态类型中，可以通过使用与
类
相同的名称添加到
命名空间
。当您编写
类Foo{}
时，它将名为
Foo
的值视为命名空间，您可以合并到其中。例如：

import { Draggable, LeafletEvent } from 'leaflet';

interface PeanutButterEvent extends LeafletEvent {
  chunky: boolean
}

declare module 'leaflet' {
  interface Evented {
    on(type: "peanut-butter", fn: (x: PeanutButterEvent) => void): this;
  }
}

const draggable = new Draggable(new HTMLElement()) // whatever
draggable.on("peanut-butter", e => console.log(e.chunky ? "Chunky" : "Creamy")); // ok
draggable.on("resize", e => console.log(e.oldSize)); // still works

import { Draggable, Evented } from 'leaflet';

declare module 'leaflet' {
  namespace Evented {
    export function hello(): void;
  }
}
Evented.hello = () => console.log("hello"); // implement if you want
Draggable.hello(); // okay
Draggable.mergeOptions({}); // still works

在这里，我将另一个名为
hello（）
的静态方法添加到名为
Evented
的
命名空间中