TS 通用“字符串”语法的文档答案

【问题标题】：Documentation for TS generic "string" syntaxTS 通用“字符串”语法的文档
【发布时间】：2018-10-10 01:27:37
【问题描述】：

此语法按预期编译和工作：

window.addEventListener("keydown", this.handlerKeyDown, false);
...
this.handlerKeyDown = (evt => {
        let ke = evt as KeyboardEvent;
        console.log("handlerKeyDown saw", ke.key);            
        return false;
    });

但它需要强制转换为 KeyboardEvent。

我注意到，当我将鼠标悬停在 addEventListener 方法上时，提示会显示

(method) Window.addEventListener<"keypress">(type: "keypress", 
listener: (this: Window, ev: KeyboardEvent) => any, 
options?: boolean | AddEventListenerOptions | undefined): void (+1 overload)

我真的更喜欢不需要强制类型转换的强类型签名，但我一直在寻找这种语法的文档。

试图猜测，我注意到Window.addEventListener<"keypress">( 语法不会让我的编译器感到不安，但我无法弄清楚它想要定义侦听器的 lambda 表达式。

谁能举例说明或提供正确的搜索词？

让我困惑的一件事是如何控制事件是否被消费。 EventListener 的定义是

interface EventListener {
    (evt: Event): void;
}

根据 Basarat 的回答，我试图指定一个更强的签名，但这与 EventListener 接口不兼容，这就是我查看上面已经发布的定义的原因。

Basarat 提出了完全相同的方法这一事实让我感到鼓舞，我尝试了这个

    this.handlerKeyDown = (ke: Event | KeyboardEvent) => {
        if (ke instanceof KeyboardEvent) {
            console.log("handlerKeyDown saw", ke.key);
            if (this.router && ke.key === "Esc") {
                this.router.navigateBack();
            }
            return true;
        }
    };

这不再让编译器感到不安，但这并不是对演员表的巨大改进。

【问题讨论】：

listener: (this: Window, ev: KeyboardEvent) => any 是一个函数，它接受KeyboardEvent 的单个参数，返回任何内容，并且在函数内将this 键入为Window。

标签： typescript addeventlistener typescript-generics

【解决方案1】：

我真的更喜欢不需要强制转换的强类型签名

添加注释：

this.handlerKeyDown = (evt: KeyboardEvent => {

如果你将它内联，编译器会推断它：

window.addEventListener("keydown", (e /* type will be inferred */) => {});

【讨论】：

这就是我试图做的，但是我无法将它分配给 this.handlerKeyDown ，我需要稍后将其删除。
然后按照说明添加注释?
我会接受这个答案，即使结果并没有大大改进我的代码，因为你已经回答了这个问题并帮助我确定了我的选择。

更多