打字稿：instanceof 检查不智能转换答案

【问题标题】：Typescript: instanceof check doesn't smart cast打字稿：instanceof 检查不智能转换
【发布时间】：2020-10-04 10:19:06
【问题描述】：

我有一个像这样的事件监听器回调：

function(ev: Event) {
    var userBox = id("user-box");
    var target = ev.target;
    // here
}

现在，我需要将目标投射到 Element。为什么会这样编译：

function(ev: Event) {
    var userBox = id("user-box");
    var target = ev.target;
    if (target instanceof Element) {
        if (userBox.contains(target)) {
            // do something
        }
    }
}

...但这不是？

function(ev: Event) {
    var userBox = id("user-box");
    var target = ev.target;
    if (target !instanceof Element) {
        return;
    }
    if (userBox.contains(target)) {
        // do something
    }
}

【问题讨论】：

因为它是语法错误（在 JavaScript 中）或非null 断言运算符（在 TypeScript 中）。 instanceof 是一个中缀运算符，它期望它的操作数在它的左边和右边。你需要if (!(target instanceof Element))。

标签： node.js typescript casting return instanceof

【解决方案1】：

variable instanceof XYZ 是产生boolean 值的单个操作。可以通过添加括号来反转它：!(target instanceof Element)。当您执行target! instanceof Element 时，您在target 上调用TypeScript 中的非空断言运算符，这是一个编译时断言。

例如

function(ev: Event) {
    var userBox = id("user-box");
    var target = ev.target;
    if (!(target instanceof Element)) {
        return;
    }
    if (userBox.contains(target)) {
        // do something
    }
}

【讨论】：

关于这个问题的 TypeScript 方面以及为什么它不是语法错误的观点非常好！
T.J.克劳德刚刚在主帖下评论了这个，谢谢你们！将在 9 分钟内将此标记为已解决。
@julkali - 是的，但简洁指出了为什么您没有收到语法错误。一开始我有点忘记你在使用 TypeScript。 :-D