TypeScript 怎么实现深度 Partial 和深度 Readonly？

Question

仓乃文 · Accepted Answer

内置 Partial 和 Readonly 只处理一层属性，嵌套对象内部的属性不会被影响。DeepPartial 和 DeepReadonly 递归处理所有层级，让嵌套对象的每个属性都变为可选或只读，适合深层配置对象和不可变数据。深度可选： ```typescript type DeepPartial = { [P in keyof T]?: T[P] extends object ? DeepPartial : T[P]; }; interface Config { database: { host: string; port: number; auth: { user: string; pass: string } }; cache: { ttl: number; maxSize: number }; } type PartialConfig = DeepPartial; // database?.auth?.pass 都可选，而不只是 database 可选 ``` 深度只读： ```typescript type DeepReadonly = { readonly [P in keyof T]: T[P] extends object ? DeepReadonly : T[P]; }; const config: DeepReadonly = { database: { host: "localhost", port: 5432, auth: { user: "admin", pass: "123" } }, cache: { ttl: 300, maxSize: 100 } }; config.database.host = "other"; // 报错 config.database.auth.pass = "xxx"; // 报错 ``` 补充说明： - 递归类型可能导致复杂对象的编译性能下降 - 需要排除 Date、RegExp 等内置对象避免误处理：T[P] extends Date ? T[P] : ... - TS 4.1+ 支持递归条件类型，之前版本可能报错 - DeepPartial 适合表单编辑、配置合并等场景 - DeepReadonly 适合冻结配置、Redux state 等不可变数据