TypeScript中instanceof加/不加===true为何类型检查表现不同？

问题核心：TypeScript的类型守卫识别规则 #

TypeScript的类型收缩（即缩小变量的类型范围），仅对特定形式的表达式生效——这些表达式被称为内置类型守卫，包括直接使用x instanceof T、typeof x === 'xxx'、'prop' in x这类原生操作判断。

如果你把instanceof的结果和true/false做比较，整个表达式就变成了普通的布尔值对比，TypeScript不会把这种复合表达式当成类型守卫，自然也就不会帮你收缩变量的类型。

两种写法的具体区别 #

1. 直接用foo instanceof Element #

var foo = document.getElementById('foo'); // 类型为 Element | null

if (foo instanceof Element) {
    // 此处TypeScript自动将foo的类型**收缩为Element**，确认它不可能是null
    foo.innerHTML = "Some text"; // 完全合法，无报错
}

这里TypeScript能认出foo instanceof Element是标准的instanceof类型守卫，当条件为真时，直接把foo的类型从Element | null窄化为Element，所以后续访问属性没有问题。

2. 写成foo instanceof Element === true #

var foo = document.getElementById('foo'); // 类型仍为 Element | null

if (foo instanceof Element === true) {
    // 此处foo的类型未改变，依旧是Element | null，TypeScript未做类型收缩
    foo.innerHTML = "Some text"; // 报错：`'foo' is possibly 'null'`
}

此时的条件是(foo instanceof Element) === true，这只是个普通的布尔比较，TypeScript不会把它和类型守卫关联起来，所以foo的类型还是原来的联合类型，访问属性就会触发null检查错误。

否定判断的差异 #

同样的逻辑也适用于否定场景：

• !(foo instanceof Element)：TypeScript会识别这是instanceof守卫的否定形式，自动把foo的类型收缩为null，后续可以安全处理null的情况。
• foo instanceof Element === false：还是复合布尔表达式，TypeScript不做类型收缩，foo依旧是Element | null，无法直接安全操作。

总结 #

这两种写法在运行时逻辑上完全等价，但在TypeScript的类型系统里有本质区别：直接使用instanceof能触发类型守卫，帮你自动收缩类型；而添加=== true/false的复合表达式不行，因为TypeScript的类型分析器不把这种形式纳入内置类型守卫的识别范围。

内容的提问来源于stack exchange，提问作者Mulot