答案：现代Web应用通过分离语言内容与逻辑实现国际化，利用JavaScript的Intl API处理日期、数字等本地化格式，并结合键值映射或i18next等库实现多语言支持，同时可动态切换语言并持久化用户偏好。
处理国际化（i18n）和本地化（l10n）在现代Web应用中非常重要，JavaScript提供了多种方式来支持多语言和区域格式。核心思路是分离语言内容与代码逻辑，并根据用户环境动态加载对应的语言资源。
使用内置API进行本地化格式化
JavaScript的 Intl API 是处理日期、时间、数字、货币等本地化格式的强大工具，无需引入额外库。
• 格式化日期和时间：new Intl.DateTimeFormat('zh-CN').format(new Date()) 输出中文格式日期，如“2024/5/20”
new Intl.DateTimeFormat('en-US', { weekday: 'long' }).format(new Date()) 输出“Monday”
立即学习“Java免费学习笔记（深入）”；
• 格式化数字和货币：new Intl.NumberFormat('de-DE').format(123456.78) 输出 “123.456,78”
new Intl.NumberFormat('ja-JP', { style: 'currency', currency: 'JPY' }).format(1000) 输出 “￥1,000”
['ä', 'a', 'z'].sort(new Intl.Collator('de').compare) 按德语排序规则处理变音字符
实现多语言文本翻译（i18n）
可通过简单的键值映射结构管理不同语言的文本内容。
• 定义语言包：
const messages = {
en: {
greeting: 'Hello',
welcome: 'Welcome to our site'
},
zh: {
greeting: '你好',
welcome: '欢迎访问我们的网站'
}
};
• 根据用户语言选择资源：
获取浏览器语言：const userLang = navigator.language || 'en';
获取最匹配语言：const lang = userLang.startsWith('zh') ? 'zh' : 'en';
function t(key) {
return messages[lang][key] || key;
}
document.getElementById('greeting').textContent = t('greeting');
使用成熟的i18n库（推荐用于复杂项目）
对于大型应用，推荐使用功能完善的第三方库，例如 i18next 或 formatjs。
• i18next 示例：安装：npm install i18next
配置：
import i18n from 'i18next';
i18n.init({
lng: 'zh',
resources: {
en: { translation: { greeting: 'Hello' } },
zh: { translation: { greeting: '你好' } }
}
});
使用：document.title = i18n.t('greeting');
它还支持复数、上下文、命名空间、异步加载语言包等高级功能。
动态切换语言与持久化偏好
允许用户手动切换语言，并将选择保存到 localStorage。
• 切换语言函数：
function setLanguage(lng) {
lang = lng;
document.documentElement.lang = lng;
localStorage.setItem('user-lang', lng);
// 重新渲染页面文本
updateUI();
}
• 页面加载时恢复用户偏好：
读取 localStorage 中的语言设置，若无则用浏览器默认语言。
基本上就这些。小项目可用原生方法加简单对象管理，复杂应用建议用 i18next 这类成熟方案，配合 Intl API 处理格式化，体验更完整。
