TS2322错误解决方案

最新推荐文章于 2025-02-28 19:02:40 发布

縱橫

最新推荐文章于 2025-02-28 19:02:40 发布

阅读量5.3k

点赞数 1

文章标签：前端 javascript typescript

本文链接：https://blog.csdn.net/w1003jpeng/article/details/130482642

版权

文章讲述了在使用TypeScript时遇到的类型限制问题，特别是当使用for...in循环处理对象时出现的错误。作者通过定义接口Options并扩展Record<string,any>来解决类型不匹配的问题，从而避免TS2322和TS7053错误，确保代码能在WebStorm中正常编译和运行。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

废话

之前写C#，所以使用强类型的语言比较习惯，用js觉得有些自由散漫了，所以学习学习ts,结果感觉ts也有好多坑，好多限制，但是又不想使用@ts-ingore。多少有点强迫症吧

从网上找了好久都没找到方法。以下方法不一定是主流或正确的做法，只是在webstorm中不会再提示错误了，可以正常编译成js代码和运行。

仅供参考

定义一个接口,用来表示自己的类型

export interface Options {
    key1: number;
    key2: boolean;
    key3?: string
}

定义两个Options类型的变量

let options1:Options = {
    key1: 0,
    key2: false
    key3: "option1"
}

let options2:Options = <Options>{
    key1: 3,
    key2: type
}

使用for…in对options1遍历给options2赋值

TS2322: Type ‘number | boolean’ is not assignable to type ‘never’. Type ‘number’ is not assignable to type ‘never’.

let key: keyof Options;
for (key in options) {
    if(option1.hasOwnProperty(key)){
        option2[key]/*ts2322*/ = options[key];
    }
}

TS7053: Element implicitly has an ‘any’ type because expression of type ‘string’ can’t be used to index type ‘Options’. No index signature with a parameter of type ‘string’ was found on type ‘Options’.

for (const key in options) {
    if(option1.hasOwnProperty(key)){
        Settings.options[key]/*ts7053*/ = options[key]/*ts7053*/;
    }
}

将定义的接口继承Record即可，指定key及值的类型

export interface Options extends Record<string, any>
    key1: number;
    key2: boolean
}

TypeScript版本：4.7.4

编辑器webstorm2022.3