TypeScript映射到对象的键和值

Question

我正在尝试遍历对象的键和值，但是TypeScript在向我喊叫。我在做什么错了？

const DATA = {
  name: "John",
  surname: "Smith",
  gender: "Male"
}

const result = Object.keys(DATA).map((d: string) => `${d} - ${DATA[d]}`)

我在下面收到TS错误

我在做什么错了？

Answer 1

只需将Object.keys返回的字符串转换为Data对象的键即可。

const DATA = {
  name: "John",
  surname: "Smith",
  gender: "Male"
}

const result = Object.keys(DATA).map((d: string) => `${d} - ${DATA[d as keyof typeof DATA]}`)

Playground Link

Answer 2

您需要告诉打字稿您对象的键是字符串类型。

const DATA: {[key: string]: string} = {
  name: "John",
  surname: "Smith",
  gender: "Male"
}

const result = Object.keys(DATA).map((d: string) => `${d} - ${DATA[d]}`)

Answer 3

对象的键本身未明确键入为字符串。

这样做的时候

Object.keys(DATA)

您正在获取姓名，姓氏，性别作为要传递到地图的值，而不是约翰，史密斯，男。

要同时键入键，您需要输入以下对象：

type DataType = {[key:string]: string }
const DATA:DataType = 
{
 name: "John",
 surname: "Smith",
 gender: "Male"
}