为什么TypeScript中括号会影响类型收窄的生效？

核心原因 #

这是TypeScript类型收窄（Narrowing）功能的语法匹配限制：

• TypeScript的typeof类型保护只识别typeof 变量 === 类型字符串这种无额外括号包裹的语法结构，命中该模式后才会对变量做类型收窄。你第一段代码刚好符合这个模式，所以if块内的val会被自动收窄为string类型，可以直接赋值给string类型的str，无报错。
• 第二段代码你给typeof val额外包裹了一层括号，(typeof val) === 'string'不符合类型保护的预设语法匹配规则，TypeScript不会将其识别为合法的typeof类型保护，也就不会对val的unknown类型做收窄，unknown类型不能直接赋值给明确的string类型变量，因此触发报错。

不止是加括号，如果你把判断写为'string' === typeof val这种调换左右两侧顺序的写法，同样不会触发typeof类型保护，本质都是不符合TypeScript预设的类型收窄语法匹配规则。

解决方案 #

如果确实需要保留括号写法，可以手动加类型断言规避报错：

let str: string = 'abc';
let val: unknown = 'test';

if ((typeof val) === 'string') { 
    str = val as string; 
}

优先推荐使用无括号的标准typeof判断写法，即可自动触发类型收窄，无需额外手动处理。

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