Javascript提高:国际化 API（Intl 对象）详解-由Deepseek产生

张

张建站

2026/4/29 6:19:23

10分钟阅读

Javascript提高:国际化 API（Intl 对象）详解-由Deepseek产生

国际化 APIIntl对象是 ECMAScript 国际化规范提供的原生工具用于处理日期、时间、数字、货币、列表、相对时间、复数规则等与语言文化相关的格式化。它的最大优势是无需第三方库且能自动适配不同地区locale的格式习惯如千位分隔符、日期顺序、货币符号位置等。下面分模块详细展开并附上代码示例。一、Intl对象概述Intl是一个全局对象包含多个构造函数和方法核心有Intl.DateTimeFormat日期时间格式化Intl.NumberFormat数字含货币、百分比、科学计数格式化Intl.RelativeTimeFormat相对时间如“3 天前”Intl.ListFormat列表格式化如“A、B 和 C”Intl.PluralRules单复数规则Intl.Collator字符串比较排序每个构造函数接受两个主要参数locales地区标识符字符串或数组如zh-CN、en-US、ja-JP。可选默认使用运行环境的默认地区。options格式化选项对象控制输出的细节。二、Intl.DateTimeFormat– 日期时间格式化基础用法constdatenewDate(2026-04-28T15:30:00);// 中文简体中国格式constdtZhnewIntl.DateTimeFormat(zh-CN);console.log(dtZh.format(date));// 2026/4/28// 美国英语格式constdtEnnewIntl.DateTimeFormat(en-US);console.log(dtEn.format(date));// 4/28/2026// 日本格式constdtJanewIntl.DateTimeFormat(ja-JP);console.log(dtJa.format(date));// 2026/4/28主要选项optionsconstoptions{dateStyle:full,// full | long | medium | shorttimeStyle:medium,// 同上weekday:long,// narrow | short | longyear:numeric,// 2-digit | numericmonth:long,// numeric | 2-digit | short | longday:numeric,hour:2-digit,minute:2-digit,second:2-digit,hour12:true,// 是否使用12小时制timeZone:Asia/Shanghai,};constformatternewIntl.DateTimeFormat(zh-CN,options);console.log(formatter.format(date));// 输出示例2026年4月28日星期二下午03:30:00formatToParts– 获取格式化后的各段内容constpartsdtZh.formatToParts(date);// [{type:year, value:2026}, {type:month, value:4}, ...]使用Intl.DateTimeFormat快速格式化内置方法也可以直接使用date.toLocaleString()它在内部调用了Intl.DateTimeFormatconsole.log(date.toLocaleString(zh-CN,{dateStyle:long}));// 2026年4月28日三、Intl.NumberFormat– 数字、货币、百分比基础用法constnum1234567.89;newIntl.NumberFormat(en-US).format(num);// 1,234,567.89newIntl.NumberFormat(de-DE).format(num);// 1.234.567,89newIntl.NumberFormat(zh-CN).format(num);// 1,234,567.89主要选项constoptions{style:currency,// decimal(默认) | currency | percent | unitcurrency:CNY,// ISO 货币代码如 USD, EUR, JPY, CNYcurrencyDisplay:symbol,// symbol | code | nameminimumFractionDigits:2,maximumFractionDigits:2,useGrouping:true,// 是否使用千位分隔符notation:compact,// standard | scientific | engineering | compactcompactDisplay:short,// short (1.2万) | long (1.2万)};示例// 货币console.log(newIntl.NumberFormat(zh-CN,{style:currency,currency:USD}).format(1234.5));// US$1,234.50// 百分比console.log(newIntl.NumberFormat(zh-CN,{style:percent}).format(0.1234));// 12%// 紧凑显示单位后缀console.log(newIntl.NumberFormat(zh-CN,{notation:compact}).format(12500));// 1.25万四、Intl.RelativeTimeFormat– 相对时间基础用法constrtfnewIntl.RelativeTimeFormat(zh-CN,{numeric:auto});console.log(rtf.format(-1,day));// 昨天console.log(rtf.format(3,day));// 3天后console.log(rtf.format(10,minute));// 10分钟后可用的时间单位year,quarter,month,week,day,hour,minute,second。选项numeric:always总是用数字如“1天前”或auto可能用“昨天”、“明天”。style:long“3 days ago”、short“3 days ago” 较短、narrow。实际应用计算距今天数functiontimeAgo(date){constrtfnewIntl.RelativeTimeFormat(zh-CN,{numeric:auto});constdiffDaysMath.round((date-newDate())/(1000*60*60*24));returnrtf.format(diffDays,day);}console.log(timeAgo(newDate(2026-04-26)));// 2天前取决于今天日期五、Intl.ListFormat– 列表连接基础用法constlist[苹果,香蕉,橘子];constlfnewIntl.ListFormat(zh-CN,{style:long,type:conjunction});console.log(lf.format(list));// 苹果、香蕉和橘子选项style:long“A, B, and C”、short、narrow通常无逗号。type:conjunction“和”、disjunction“或”、unit“米/秒”风格。六、Intl.PluralRules– 单复数判定主要用于根据数字选择正确词形如英语中的 1 book / 2 books。中文场景相对简单但对某些语言必须。constprnewIntl.PluralRules(en-US);console.log(pr.select(1));// oneconsole.log(pr.select(2));// other七、Intl.Collator– 语言敏感的字符串比较排序constnames[张三,李四,王五,陈六];constcollatornewIntl.Collator(zh-CN,{sensitivity:base});names.sort(collator.compare);console.log(names);// 按拼音排序八、关键知识点与注意事项1. 地区标识符locale标准格式语言-国家/地区如zh-CN、en-GB、zh-TW。可以使用-u-扩展指定更多细则如zh-CN-u-ca-chinese使用农历。2. 性能影响通常每次构造Intl对象有一定开销。如果频繁使用应将构造好的实例缓存起来复用。3. 浏览器兼容性主流现代浏览器和 Node.js 均完美支持。老旧浏览器如 IE11不支持但如今基本可忽略。4. 与Date.prototype.toLocaleString/Number.prototype.toLocaleString的关系这些原型方法是IntlAPI 的简易封装。两者选其一均可但Intl构造函数更清晰地隔离配置且在需要多次调用同一格式时性能更好复用实例。九、实际项目组合示例// 格式化当前时间金额总计constnownewDate();constprice12345.6;constdateFormatternewIntl.DateTimeFormat(zh-CN,{dateStyle:full,timeStyle:medium});constmoneyFormatternewIntl.NumberFormat(zh-CN,{style:currency,currency:CNY});console.log(订单时间${dateFormatter.format(now)});console.log(总金额${moneyFormatter.format(price)});// 输出示例// 订单时间2026年4月28日星期二下午03:30:00// 总金额¥12,345.60总结Intl对象是 JavaScript 原生国际化方案的基石它消除了手工拼接数字、日期的繁琐。自动处理不同地区文化习惯尽管中文和英文习惯差异不大但对德、法、阿拉伯语等差异很大。无需引入 moment.js / numeral.js 等库性能更好体积更小。在你的日常开发中如果需要跨地区展示或严格遵循本地化格式应优先使用IntlAPI。对于简单的不涉及本地化的场景如仅拼接字符串模板字符串仍然是最轻量的选择。如果还有关于某个具体构造函数或选项的疑问欢迎继续提问

终极指南：如何利用checkm8漏洞解锁iOS设备的无限可能

终极指南：如何利用checkm8漏洞解锁iOS设备的无限可能【免费下载链接】ipwndfu open-source jailbreaking tool for many iOS devices 项目地址: https://gitcode.com/gh_mirrors/ip/ipwndfu ipwndfu 是一款基于Python开发的开源越狱工具，专门针对…...

2026/4/29 6:12:24 阅读更多 →

快速部署LoRA训练环境：lora-scripts工具详解，小白友好教程

快速部署LoRA训练环境：lora-scripts工具详解，小白友好教程你是不是也对AI绘画感兴趣，想训练一个属于自己的独特风格模型，但一看到复杂的代码和参数就头疼？或者尝试过手动配置LoRA训练环境，结果被各种依赖…...

2026/4/29 6:11:25 阅读更多 →

Java 25 虚拟线程与结构化并发：构建高效并发应用

Java 25 虚拟线程与结构化并发：构建高效并发应用别叫我大神，叫我 Alex 就好 Java 25 引入了虚拟线程和结构化并发这两个革命性的特性，彻底改变了 Java 应用的并发编程模型。本文将深入探讨这两个特性的原理、使用方法以及最佳实践&#xff0…...

2026/4/29 6:08:32 阅读更多 →

AI智能体工作流编排：从单体架构到流水线协作的工程实践

1. 项目概述：当AI智能体学会“流水线”协作最近在探索AI智能体（Agent）的落地应用时，我遇到了一个非常有意思的项目：coleam00/ottomator-agents。这个名字本身就充满了想象力——“Ottomator”，听起来像是“…...

2026/4/29 5:20:31 阅读更多 →

ChatGPT翻译能力解析与实战技巧

1. ChatGPT翻译能力深度解析作为一名长期从事语言技术研究的从业者，我最近系统测试了ChatGPT在多语言翻译场景下的实际表现。与传统的机器翻译工具相比，ChatGPT展现出几个独特优势：首先，它的上下文理解能力远超传统翻译引擎。当处…...

2026/4/26 0:13:35 阅读更多 →

2026届毕业生推荐的十大降AI率助手实际效果

Ai论文网站排名（开题报告、文献综述、降aigc率、降重综合对比） TOP1. 千笔AI TOP2. aipasspaper TOP3. 清北论文 TOP4. 豆包 TOP5. kimi TOP6. deepseek 在内容生产这个过程当中，要降低AIGC也就是人工智能生成内容所占的比例&#xff…...

2026/4/26 0:15:22 阅读更多 →