最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
如何用 Intl.DisplayNames 快速将区域代码(如 US)转换为本地化的国家名称
时间:2026-06-30 11:18:57 编辑:袖梨 来源:一聚教程网
能,需显式指定 type: "region" 并传入有效 locale(如 "zh-CN"),否则默认按 language 模式处理导致返回原码 "US";输入必须为大写 ISO 3166-1 代码。
Intl.DisplayNames 能不能直接把 "US" 变成“美国”或“United States”?
能,但必须明确指定 type: "region",且语言环境(locale)要传对。很多人试了 new Intl.DisplayNames("zh") 却得到 undefined 或原样返回 "US",问题就出在这里:默认 type 是 "language",不是区域。
创建实例时最关键的三个参数
Intl.DisplayNames 构造函数接受两个参数:第一个是 locales(字符串或数组),第二个是配置对象。漏掉或写错任意一个都会导致 fallback 行为(比如返回原始代码)。
-
locales必须是真实支持的 locale 标签,例如"zh-CN"、"ja-JP"、"en-US";只写"zh"可能触发内部降级,部分浏览器会退到"en" -
type: "region"必须显式声明,否则识别的是语言代码(如"en"→ "English") -
fallback: "code"是默认值,意味着当某区域在目标 locale 下无翻译时,直接返回原始代码(如"ZZ");可设为"none"让它返回undefined,便于你主动处理异常
常见错误:为什么调用 of("US") 返回了 "US" 而不是“美国”?
典型表现是控制台输出和输入一样,看着像没生效。根本原因有三个:
- 构造时没传
type: "region",实例实际按 language 模式工作,而"US"不是合法语言代码,于是 fallback 到原字符串 -
locales值不被当前运行环境支持(比如在旧版 Safari 里传"zh-Hans",但该浏览器只认"zh-CN"),导致内部使用"en"回退,结果返回 "United States" - 传入了非法区域码(如小写
"us"),虽然多数引擎会自动大写,但规范不保证——务必确保输入是 ISO 3166-1 alpha-2 大写格式,如"US"、"CN"、"JP"
验证方式很简单:
console.log(new Intl.DisplayNames(["zh-CN"], { type: "region" }).of("US")); 正常应输出 "美国"。性能与兼容性要注意什么?
这个 API 在现代浏览器中已全量支持(Chrome 90+、Firefox 88+、Safari 15.4+),但 Node.js 需要 v18.0+ 且开启 --icu-data-dir 或使用完整 ICU 数据的构建版本。生产环境若需兼容旧版 Safari(Intl.Locale + regionNames 的 polyfill 方案(注意:这不是标准 API,属社区补丁)。
另外,Intl.DisplayNames 实例本身可复用,别在循环里反复 new;同一 locale + type 组合建议缓存实例,尤其在 React 组件或频繁格式化场景下。
相关文章
- 《千年寻仙》元素师职业玩法介绍 07-03
- 夸克浏览器如何拦截弹窗 07-03
- 异环最新兑换码大全汇总 07-03
- 深渊秘境手游好玩吗 深渊秘境手游核心玩法与新手入门指南 07-03
- Matt Pocock Skills 怎么安装?AI 编程 Agent 技能包入口说明 07-03
- AU如何将单声道转换成立体声效果 07-03