区域设置感知的类型推断
确保所有区域设置共享相同的键结构。
区域设置感知的类型推断 是 CoddyKit 上的免费 TypeScript Academy 课时。 这是第 4 节课,共 4 节。 你可以在下方免费阅读本课时的完整内容 — 然后在浏览器中使用内置代码编辑器和全天候 AI 导师进行实践。 这是 TypeScript Academy 学习路径的一部分,你的进度在网页和 CoddyKit 应用中同步。 TypeScript Academy 课程共包含 4 节课。
基于区域设置的类型推断
应用会提供多个区域设置(en、tr、de……)。我们希望有一种类型,能够在任何区域设置缺少基础区域设置中已有的键时报告错误,这样翻译就不会在不知不觉中失去同步。
基础区域设置
选择一个区域设置(通常是en)作为规范的键结构。所有其他区域设置都必须匹配其结构。
const en = {
greeting: "Hello",
cart: { empty: "Empty", checkout: "Checkout" },
} as const;
type Base = typeof en;约束其他区域设置
将每个额外区域设置的类型设为基础结构。现在,如果该区域设置文件缺少键,就会产生编译错误。
const tr: Base = {
greeting: "Merhaba",
cart: { empty: "Bo\u015f", checkout: "\u00d6deme" },
};
// Omitting cart.checkout -> Error: property missing同时捕获额外键
使用基础类型作为注解,还可以标记区域设置中存在但基础结构中不存在的未知键,从而捕获残留或拼写错误的条目。
const de: Base = {
greeting: "Hallo",
cart: { empty: "Leer", checkout: "Kasse" },
extra: "oops", // Error: not in Base
};定义区域设置的辅助函数
泛型辅助函数会强制结构保持一致,同时保留每个值,从而提供清晰的单区域设置定义位置。
function defineLocale<T extends Base>(loc: T): T {
return loc;
}
const fr = defineLocale({
greeting: "Bonjour",
cart: { empty: "Vide", checkout: "Paiement" },
});所有区域设置的注册表
将区域设置收集到一个记录中。将每个值约束为Base,可以保证整个应用具有统一的结构。
const locales: Record<string, Base> = { en, tr, de: fr };
// every entry must have the full Base key structure类型层面的深度相等性
若要获得更严格的保证,您可以构建一个SameKeys类型,深入比较键结构;当结构不同时,它会解析为错误类型,其检查范围超出普通注解的能力。
type SameKeys<A, B> =
keyof A extends keyof B
? keyof B extends keyof A ? true : false
: false;只推导一次键
由于所有区域设置都共享Base,键路径类型(来自前一课)只需从Base计算一次,之后便可供每个区域设置复用,因此t的类型定义与区域设置无关。
type Key = LeafPaths<Base>;
// same valid keys regardless of active locale运行时选择区域设置
在运行时,您可以使用当前区域设置作为键从注册表中进行索引;类型系统已经保证每个区域设置具有相同的键,因此查找是安全的。
function translate(locale: keyof typeof locales, key: Key): string {
return getPath(locales[locale], key);
}检测区域设置之间的缺失键
如果无法直接为每个文件添加注解(例如导入对象表示法文件时),构建时类型检查可以将每个导入的区域设置与Base进行比较,并显示一个列出缺失键的差异类型。
type Missing<L> = Exclude<keyof Base, keyof L>;
type TrMissing = Missing<typeof tr>; // never if complete为何重要
无类型的国际化代码会逐渐偏离:添加到en中的键可能被遗忘在de中,最终显示空字符串或英文字符串。将每个区域设置约束为共享的基础结构,可以把这种遗漏转化为编译错误,从而确保所有区域设置完整且一致。
快速检查
确认您对基于区域设置的类型推断的理解。
回顾
您选择了一个基础区域设置作为规范结构,并将所有其他区域设置约束为该结构,因此缺少键或存在额外键都会导致编译失败。defineLocale辅助函数和受约束的注册表可以让所有区域设置在结构上保持一致,而键路径只需从基础结构推导一次。
用 AI 导师学习 TypeScript — 免费
在浏览器中编写并运行真实代码,获得全天候 AI 导师的即时帮助,并在网页或应用中继续学习。
- 课程
- 101
- 课程
- 352
常见问题解答
「区域设置感知的类型推断」课时是免费的吗?
是的 — 「区域设置感知的类型推断」的完整文本可在网页上免费阅读。要进行交互式练习(内置代码编辑器和全天候 AI 导师)并解锁 TypeScript Academy 课程的其余内容,请升级到 CoddyKit PRO。 TypeScript Academy 课程共包含 4 节课。
「区域设置感知的类型推断」这节课中我会学到什么?
确保所有区域设置共享相同的键结构。 你通过在浏览器中直接运行的动手代码来练习 TypeScript Academy,全天候 AI 导师会在你学习这节课的过程中回答你的问题。
学习 TypeScript Academy 需要有经验吗?
无需任何先前经验。CoddyKit 上的 TypeScript Academy 课程适合初学者到高级学习者,你可以从这里开始或从头开始,按照自己的节奏学习。 这是第 4 节课,共 4 节。
「区域设置感知的类型推断」课时需要多长时间?
大多数 CoddyKit 课程大约需要 5–10 分钟。每节课都很精短且互动,所以你能稳步进步,并在网页和应用中从离开的地方继续。
我能在这节 TypeScript Academy 课中编写并运行代码吗?
能。每节 TypeScript Academy 课都包含内置代码编辑器,你可以在浏览器中直接编写并运行真实代码,并获得即时 AI 反馈 — 无需本地设置。
此课程中的所有课时
- 翻译键的类型标注
- 插值的类型安全
- 使用类型处理复数形式
- 区域设置感知的类型推断