如何推断TypeScript中JSON对象的属性类型？

假设我们有如下JSON文件（faq.json）：

{
  "hardened-computer": {
    "metadata": {
      "title": "How to verify integrity of release?"
    },
    "content": "foo"
  },
  "release-integrity": {
    "metadata": {
      "title": "What is a hardened computer?"
    },
    "content": "bar"
  }
}

在TypeScript项目中导入该文件后，需要用URI路径中的topic（比如/faq/[topic]）作为属性键获取对应数据，下面介绍两种推断SomeType类型的方法：

方法一：自动推断属性值类型 #

直接利用TypeScript的类型推导能力，通过typeof faq[keyof typeof faq]获取JSON对象所有属性值的类型：

import faq from "./faq.json"

const getTopic = () => {
  // 模拟从URI提取topic的逻辑，返回实际存在的键值
  return "hardened-computer" as const;
}

const topic = getTopic()

// 自动推断所有topic对应的对象类型
type SomeType = typeof faq[keyof typeof faq]

let topicData: SomeType

topicData = faq[topic as keyof typeof faq]

这种方式无需手动定义接口，后续JSON文件新增或修改结构时，类型会自动同步更新。如果所有topic的结构一致，SomeType会是统一的对象类型；如果结构不同，则会是多个类型的联合类型。

方法二：手动定义统一接口 #

如果所有FAQ项的结构固定，可以手动定义接口来约束类型：

import faq from "./faq.json"

const getTopic = () => {
  return "hardened-computer" as const;
}

const topic = getTopic()

// 定义单个FAQ项的结构接口
interface FaqItem {
  metadata: {
    title: string;
  };
  content: string;
}

// SomeType直接复用该接口
type SomeType = FaqItem

let topicData: SomeType

topicData = faq[topic as keyof typeof faq]

这种方式类型更清晰，适合需要明确结构约束的场景。

内容的提问来源于stack exchange，提问作者sunknudsen