本教程将指导您如何使用javaScript的`Intl.dateTimeformat` API，高效地获取并显示从周一到周日、按指定语言环境格式化的星期几短名称序列。文章将详细介绍核心概念、提供完整的代码示例，并解释如何确保序列始终从周一开始，同时兼顾国际化需求。
在现代Web开发中，经常需要根据用户的语言环境（Locale）来展示日期和时间信息。其中一个常见需求是获取一周中每一天的本地化短名称，并且要求序列从周一开始，到周日结束。javascript的Intl.DateTimeFormat API提供了强大的国际化能力，能够优雅地解决这一问题。
核心工具：Intl.DateTimeFormat
Intl.DateTimeFormat 是ecmascript国际化API的一部分，它允许您以语言敏感的方式格式化日期和时间。通过配置不同的选项，可以控制输出的格式，例如是显示完整的星期名称还是短名称。
要获取星期的短名称，我们需要在创建 Intl.DateTimeFormat 实例时指定 weekday: ‘short’ 选项。
立即学习“Java免费学习笔记（深入）”；
const locale = "zh-CN"; // 例如，中文（中国大陆） const formatter = new Intl.DateTimeFormat(locale, { weekday: 'short' // 请求星期的短名称 });
实现步骤与代码示例
获取从周一到周日的本地化星期短名称序列的关键在于两点：一是利用 Intl.DateTimeFormat 进行本地化格式化；二是通过巧妙的日期计算确保遍历顺序始终是周一到周日。
以下是实现这一目标的详细步骤和完整代码示例：
- 初始化语言环境和格式化器：首先，确定您希望使用的语言环境，并创建一个 Intl.DateTimeFormat 实例。
- 准备存储数组：创建一个空数组，用于存放获取到的星期短名称。
- 遍历一周并计算日期：
- JavaScript的 Date.prototype.getDay() 方法返回一个表示星期几的数字，其中0代表星期日，1代表星期一，以此类推，直到6代表星期六。
- 为了确保我们总是从周一开始遍历，我们可以利用当前的日期 today 和一个循环变量 i（从0到6）。我们定义一个 targetDayIndex 从1（周一）到7（周日）。
- 通过计算 (targetDayIndex – today.getDay() + 7) % 7，我们可以得到一个相对于 today 的偏移量。这个偏移量将把 today 的日期调整到目标 targetDayIndex 所代表的星期几。例如，如果 today 是周三（today.getDay() 为3），我们想获取周一（targetDayIndex 为1），那么 (1 – 3 + 7) % 7 结果为 5，这意味着我们需要将 today 的日期加上5天，才能得到本周的周一。
- date.setDate() 方法用于设置日期。
- 提取星期短名称：使用 formatter.formatToParts(date) 方法，它可以将日期格式化为组成部分的数组。我们然后查找 type 为 ‘weekday’ 的部分，并提取其 value。
/** * 获取指定语言环境下，从周一到周日的星期短名称序列。 * @param {string} locale - 目标语言环境字符串，例如 "en-US", "fr-FR", "zh-CN"。 * @returns {string[]} 包含从周一到周日的星期短名称数组。 */ function getLocalizedShortWeekdays(locale) { const shortNames = []; // 创建一个日期格式化器，用于获取星期的短名称 const formatter = new Intl.DateTimeFormat(locale, { weekday: 'short' }); // 获取当前日期，作为计算基准 const today = new Date(); // 遍历从周一（1）到周日（7） // 注意：JavaScript的Date.getDay() 0=周日, 1=周一, ..., 6=周六 const mondayIndex = 1; // 目标周的起始日索引 (周一) for (let i = 0; i < 7; i++) { // targetDayIndex 依次为 1 (Mon), 2 (Tue), ..., 7 (Sun) const targetDayIndex = (mondayIndex + i); const date = new Date(today); // 复制当前日期，避免修改原对象 // 计算从 today 到目标 targetDayIndex 所需的日期偏移量 // (targetDayIndex - today.getDay()) 计算了目标日与当前日的相对偏移。 // + 7) % 7 确保结果始终为正数，并且正确处理了跨周的情况， // 使得偏移量总是指向本周或下周的正确日期。 const diff = (targetDayIndex - today.getDay() + 7) % 7; date.setDate(today.getDate() + diff); // 格式化日期并提取星期短名称 const formattedParts = formatter.formatToParts(date); const shortName = formattedParts.find(part => part.type === 'weekday').value; shortNames.push(shortName); } return shortNames; } // 示例用法 console.log("英语 (美国):", getLocalizedShortWeekdays("en-US")); // 预期输出示例: 英语 (美国): [ 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun' ] console.log("法语 (法国):", getLocalizedShortWeekdays("fr-FR")); // 预期输出示例: 法语 (法国): [ 'lun.', 'mar.', 'mer.', 'jeu.', 'ven.', 'sam.', 'dim.' ] console.log("中文 (中国):", getLocalizedShortWeekdays("zh-CN")); // 预期输出示例: 中文 (中国): [ '周一', '周二', '周三', '周四', '周五', '周六', '周日' ] console.log("日语 (日本):", getLocalizedShortWeekdays("ja-JP")); // 预期输出示例: 日语 (日本): [ '月', '火', '水', '木', '金', '土', '日' ]
关键点与注意事项
- 语言环境（Locale）的选择：locale 参数是此功能的核心。它决定了星期名称的语言和格式。您可以根据用户设置或应用程序的默认语言动态地选择 locale。常见的语言环境字符串包括 en-US（美式英语）、fr-FR（法语）、de-DE（德语）、zh-CN（简体中文）等。
- formatToParts() 的优势：虽然 formatter.format(date) 也可以直接返回格式化后的字符串，但 formatToParts() 返回一个对象数组，每个对象表示日期时间字符串的一个组成部分（例如，年份、月份、日期、星期等）。这使得我们可以精确地提取所需的部分（即 weekday 类型的值），而无需进行复杂的字符串解析。
- 周的起始日：不同文化对一周的起始日有不同的定义（例如，有些国家从周日开始，有些从周一开始）。本教程中的代码通过显式计算，强制生成的序列从周一开始，从而避免了 Intl.DateTimeFormat 默认行为可能带来的不一致性。
- 性能考量：对于需要频繁获取星期名称的场景，如果语言环境和格式选项不变，可以考虑将 getLocalizedShortWeekdays 函数的返回值缓存起来，避免重复计算，从而优化性能。
总结
通过 Intl.DateTimeFormat API 结合精确的日期计算逻辑，我们可以轻松地在 JavaScript 中获取并展示符合特定语言环境、且从周一到周日排序的星期短名称序列。这种方法不仅提供了强大的国际化支持，也确保了在不同地区和文化背景下的数据展示一致性，是构建全球化Web应用不可或缺的工具。