TypeScript模板字面量类型对字符串拼接生成的对象键不触发校验问题
问题原因
这两个未触发报错的情况均是TypeScript 4.4版本的类型推导特性限制导致:
- 针对
[`prop${myString}`]:你声明的myString默认被推导为宽泛的string类型而非字符串字面量类型,模板字符串拼接string类型变量后,最终键的类型被推导为通用string类型。TypeScript 4.4在处理对象字面量的动态键时,若键的类型是通用string,不会对其做模板字面量索引签名的严格校验,因此不会报错。 - 针对
['test'+'test']:TypeScript直到4.7版本才支持两个字符串字面量相加的结果推导为对应的字符串字面量类型,在4.4版本中,'test'+'test'的运算结果会被推导为通用string类型,和上一种情况同理,不会触发校验报错。
修复方案
- 对于变量参与的模板字符串键,可通过
as const将变量标记为字面量类型,触发严格校验:
const myString = 'a' as const; // 此时[`prop${myString}`]的类型会被推导为`propa`,不符合`prop${number}`规则,会正常报错
- 对于字符串拼接的键,优先使用模板字符串代替加号拼接,或者升级TypeScript到4.7及以上版本,即可让字符串相加的结果被正确推导为字面量类型,触发校验。
- 若要强制所有动态键都做严格校验,可以开启TS配置中的
exactOptionalPropertyTypes以及noPropertyAccessFromIndexSignature,配合更高版本的TS使用效果更好。
内容的提问来源于stack exchange,提问作者Hozeis
相关产品推荐
相关产品推荐

