我从一个文件中读取键值对,键是字符串,值是{r,g,b}个数字.

ColorNames.json文件:

{
  "name1": { "r": 151, "g": 23, "b": 26 },
  "name2": { "r": 62, "g": 137, "b": 32 },
  "name3": { "r": 13, "g": 31, "b": 62 },
}
fetch("/colorNames.json")
  .then((res) => res.json())
  .then((data) => {
    colorsNames = data;
  });

当我将值传递给函数时,我收到以下错误:

元素隐式具有""any""类型,因为""字符串""类型的表达式不能用于索引类型""{}""."" 在类型‘{}’上未找到参数类型为‘STRING’的索引签名.

for (let key in colorsNames) {
    let distance = getDistance(color, colorsNames[key]);
}
function getDistance(
    color: { r: number; g: number; b: number },
    match: { r: number; g: number; b: number }
  )

另外,将ColorsNames声明为的正确方式是什么?

var colorsNames: object;

推荐答案

看起来您希望colorsNames具有string index signature,这样您就可以使用任何值为string的键对其进行索引.就像这样:

const colorsNames: { [k: string]: { r: number, g: number, b: number } } = {
    "name1": { "r": 151, "g": 23, "b": 26 },
    "name2": { "r": 62, "g": 137, "b": 32 },
    "name3": { "r": 13, "g": 31, "b": 62 },
};

这里您的意思是,对于键为string类型的每个属性,都有一个{r: number, g: number, b: number}类型的值(您可能想给它命名,比如interface Color {r: number, g: number, b: number},但这是题外话).

现在,您可以根据需要迭代其属性:

for (let key in colorsNames) {
    let distance = getDistance(color, colorsNames[key]); // okay
}

Playground link to code

Typescript相关问答推荐

脉轮ui打字脚本强制执行图标按钮的咏叹调标签-如何关闭

如何在TypeScript对象迭代中根据键推断值类型?

如果一个变量不是never类型,我如何创建编译器错误?

如何将联合文字类型限制为文字类型之一

如何正确地对类型脚本泛型进行限制

如何使用泛型自动推断TS中的类型

如何在Angular 12中创建DisplayBlock组件?

CDK从可选的Lambda角色属性承担角色/复合主体中没有非空断言

正交摄影机正在将渲染的场景切成两半

使用TypeScrip的类型继承

S,为什么我的T扩展未定义的条件在属性的上下文中不起作用?

Cypress-验证别名的存在或将别名中的文本与';if';语句中的字符串进行比较

三重融合视角与正交阵

使用RXJS获取数据的3种不同REST API

如何处理可能为空的变量...我知道这不是Null?

如何使用 AWS CDK 扩展默认 ALB 控制器策略?

Next 13 + React 18 createContext 类型的构建问题

Select 器数组到映射器的Typescript 泛型

基于可选参数的动态类型泛型类型

基于泛型的柯里化函数的条件参数