TypeScript Academy · 课时

keyof 类型运算符

Q: 「keyof 类型运算符」这节课中我会学到什么？

使用 keyof 获取对象类型键的联合类型。 你通过在浏览器中直接运行的动手代码来练习 TypeScript Academy，全天候 AI 导师会在你学习这节课的过程中回答你的问题。

使用 keyof 获取对象类型键的联合类型。

第 2 / 4 课13 个步骤

keyof 类型运算符 是 CoddyKit 上的免费 TypeScript Academy 课时。这是第 2 节课，共 4 节。你可以在下方免费阅读本课时的完整内容 — 然后在浏览器中使用内置代码编辑器和全天候 AI 导师进行实践。这是 TypeScript Academy 学习路径的一部分，你的进度在网页和 CoddyKit 应用中同步。 TypeScript Academy 课程共包含 4 节课。

类型的 keys

keyof 运算符接受对象类型，并生成其属性 keys 的联合类型。它是实现类型安全的属性访问和泛型 key 工具的基础。

基本 keyof

对接口应用 keyof，可以获得其 key 名称组成的联合类型，且这些名称是字符串字面量类型。

interface User {
  id: number
  name: string
}
type UserKeys = keyof User // "id" | "name"
const k: UserKeys = "name"
console.log(k)

仅允许 valid keys

类型为 keyof T 的变量只能保存 T 实际存在的某个 key。拼写错误和无效 key 会在编译时被捕获。

interface User { id: number; name: string }
const valid: keyof User = "id"
// const bad: keyof User = "email" // Error: not a key of User
console.log(valid)

keyof 与 typeof

将它与 typeof 结合，可以获取某个值的推断类型的 keys。这里无需编写接口，就能获得 config 对象的 keys。

const config = { host: "localhost", port: 8080 }
type ConfigKey = keyof typeof config // "host" | "port"
const key: ConfigKey = "port"
console.log(config[key])

字符串索引签名的 keyof

对于带有字符串索引签名的类型，keyof 是 string | number，因为允许使用任意字符串 key，而数字 key 会强制转换为字符串。

type Dict = { [key: string]: number }
type DictKeys = keyof Dict // string | number
const k: DictKeys = "anything"
console.log(k)

数字索引签名的 keyof

对于数字索引签名，keyof 就是 number。这与数组公开数字索引的方式相符。

type NumDict = { [i: number]: string }
type NumKeys = keyof NumDict // number
const k: NumKeys = 0
console.log(k)

数组类型的 keyof

对数组类型应用 keyof 会得到一个出人意料的联合类型：数字索引，以及所有数组方法和属性名称，例如 length 和 push。

type ArrKeys = keyof string[]
// number | "length" | "push" | "map" | ... many more
const k: ArrKeys = "length"
console.log(k)

安全地遍历 keys

使用 keyof 编写只操作 valid keys 的循环。将 Object.keys 转换为 (keyof T)[] 可以保证索引访问的类型安全。

interface User { id: number; name: string }
const u: User = { id: 1, name: "Ada" }
const keys = Object.keys(u) as (keyof User)[]
for (const k of keys) console.log(k, u[k])

泛型约束中的 keyof

泛型 key 参数通常使用 K extends keyof T 进行约束。这可以保证该 key 确实存在于对象中。

function pluck<T, K extends keyof T>(obj: T, key: K): T[K] {
  return obj[key]
}
const name = pluck({ id: 1, name: "Ada" }, "name")
console.log(name) // Ada

组合多个 keys

由于 keyof T 是联合类型，因此您可以对其求交集或进行筛选。这里的函数接受一个 valid keys 数组。

function pick<T, K extends keyof T>(obj: T, keys: K[]): Pick<T, K> {
  const out = {} as Pick<T, K>
  for (const k of keys) out[k] = obj[k]
  return out
}
console.log(pick({ a: 1, b: 2, c: 3 }, ["a", "c"]))

keyof 为何重要

keyof 会将属性名称转换为可检查的类型，从而支持泛型获取器、设置器和映射器，并确保它们不会引用不存在的 key。它在高级 TypeScript 中随处可见。

interface Settings { theme: string; size: number }
function has<T>(obj: T, key: keyof T): boolean {
  return key in (obj as object)
}
console.log(has<Settings>({ theme: "x", size: 1 }, "theme"))

快速检查

测试您对 keyof 运算符的理解。

在交互式课程中回答

回顾

keyof T 会将 T 的属性 keys 生成为字面量类型组成的联合类型，从而将变量限制为 valid keys。对于字符串索引签名，它返回 string | number；对于数字索引签名，它返回 number。与 typeof 搭配时，它可以从值推导 keys；与泛型（K extends keyof T）搭配时，它可以支持类型安全的获取器、选择器和遍历。

免费开始

用 AI 导师学习 TypeScript — 免费

在浏览器中编写并运行真实代码，获得全天候 AI 导师的即时帮助，并在网页或应用中继续学习。

课程: 101
课程: 352

免费开始学习查看完整课程

常见问题解答

「keyof 类型运算符」课时是免费的吗？

是的 — 「keyof 类型运算符」的完整文本可在网页上免费阅读。要进行交互式练习（内置代码编辑器和全天候 AI 导师）并解锁 TypeScript Academy 课程的其余内容，请升级到 CoddyKit PRO。 TypeScript Academy 课程共包含 4 节课。

「keyof 类型运算符」这节课中我会学到什么？

使用 keyof 获取对象类型键的联合类型。你通过在浏览器中直接运行的动手代码来练习 TypeScript Academy，全天候 AI 导师会在你学习这节课的过程中回答你的问题。

学习 TypeScript Academy 需要有经验吗？

无需任何先前经验。CoddyKit 上的 TypeScript Academy 课程适合初学者到高级学习者，你可以从这里开始或从头开始，按照自己的节奏学习。这是第 2 节课，共 4 节。

「keyof 类型运算符」课时需要多长时间？

大多数 CoddyKit 课程大约需要 5–10 分钟。每节课都很精短且互动，所以你能稳步进步，并在网页和应用中从离开的地方继续。

我能在这节 TypeScript Academy 课中编写并运行代码吗？

能。每节 TypeScript Academy 课都包含内置代码编辑器，你可以在浏览器中直接编写并运行真实代码，并获得即时 AI 反馈 — 无需本地设置。

此课程中的所有课时

← 返回 TypeScript Academy