如何编写onValueChange函数让TypeScript自动推断val的对应类型(无需as number)
解决方案
要实现这个需求,核心是用泛型把field和val的类型绑定起来,让TypeScript能根据传入的字段名自动推断对应的值类型,替代原本宽泛的联合类型约束。
修改后的代码如下:
interface IRow { age: number; name: string; born: Date; isGood: boolean; } const state: IRow = { age: 5, name: 'bob', born: new Date(), isGood: true } // 用泛型K约束field为IRow的具体键,val对应IRow[K]的类型 const onValueChange = <K extends keyof IRow>(field: K) => (val: IRow[K]) => { if (field === 'age') { const someNumber = 2 * val; // 此时val被自动推断为number,无类型错误 state[field] = val; // 类型完全匹配,无赋值错误 } } onValueChange('age')(5); // 正确,val必须传入number类型 onValueChange('name')('alice'); // 正确,val必须传入string类型 onValueChange('born')(new Date()); // 正确 onValueChange('isGood')(false); // 正确
原理说明
- 泛型
K extends keyof IRow限定了field是IRow的某一个具体键,而非所有键的联合类型。 - 当调用
onValueChange('age')时,TypeScript会自动将泛型K推断为'age',后续的val类型就会被约束为IRow['age'](也就是number)。 - 在
if (field === 'age')的分支里,TypeScript通过类型收窄机制,确认当前val的类型是number,无需额外的类型断言。
内容的提问来源于stack exchange,提问作者prof chaos
相关产品推荐
相关产品推荐

