如何不依赖第三方库将日期字符串格式化为多语言完整文本格式

核心需求 #

• 不引入任何体积较大的第三方日期处理库（如moment、date-fns全量包），仅用浏览器/Node.js原生能力完成格式化
• 基础场景：将ISO格式时间字符串（如 "2020-10-23T13:00:48.207Z"）转换为自然语言格式，英文输出示例为 "October, 23rd 2020"
• 扩展能力：支持多语言切换输出，例如法语场景输出 "23 Octobre 2020"

基础英文场景实现 #

整个实现不需要复杂的时间解析逻辑，直接依托原生Date对象完成取值，核心需要两个预置查找规则：

1. 英文月份全称映射表，索引和Date对象返回的0-11月份值一一对应
2. 日期数字后缀规则：注意11/12/13这三个特殊日期的后缀统一为th，其余日期按照个位数字匹配st/nd/rd/th后缀

参考实现代码：

// 英文月份映射
const MONTH_NAMES_EN = [
  "January", "February", "March", "April", "May", "June",
  "July", "August", "September", "October", "November", "December"
];
/**
 * 获取日期对应的英文后缀
 * @param {number} day 日期数字 1-31
 */
function getDaySuffix(day) {
  // 处理11、12、13的特殊情况
  if (day > 10 && day < 14) return "th";
  switch (day % 10) {
    case 1: return "st";
    case 2: return "nd";
    case 3: return "rd";
    default: return "th";
  }
}
/**
 * 格式化为英文目标格式
 * @param {string} isoDate 标准ISO时间字符串
 */
function formatEnglish(isoDate) {
  // 若需要匹配本地时区取值，将getUTC*系列方法替换为对应get*方法即可
  const targetDate = new Date(isoDate);
  const monthName = MONTH_NAMES_EN[targetDate.getUTCMonth()];
  const day = targetDate.getUTCDate();
  const year = targetDate.getUTCFullYear();
  return `${monthName}, ${day}${getDaySuffix(day)} ${year}`;
}
// 运行验证：formatEnglish("2020-10-23T13:00:48.207Z") 输出 "October, 23rd 2020"

多语言能力扩展 #

多语言场景不需要改动核心取值逻辑，只需要把不同语言的月份映射、拼接格式抽成配置项，实现配置化渲染即可。比如法语场景的实现只需要新增对应配置：

• 法语月份全称映射表
• 法语格式规则：日期在前、月份居中、无日期后缀、无逗号分隔

抽离通用格式化函数后的参考代码：

// 多语言配置库
const LOCALE_RULES = {
  en: {
    months: MONTH_NAMES_EN,
    render: (month, day, year, suffixFn) => `${month}, ${day}${suffixFn(day)} ${year}`
  },
  fr: {
    months: [
      "Janvier", "Février", "Mars", "Avril", "Mai", "Juin",
      "Juillet", "Août", "Septembre", "Octobre", "Novembre", "Décembre"
    ],
    render: (month, day, year) => `${day} ${month} ${year}`
  }
}
/**
 * 通用多语言格式化入口
 * @param {string} isoDate 标准ISO时间字符串
 * @param {string} locale 语言标识，默认en
 */
function formatByLocale(isoDate, locale = "en") {
  const rule = LOCALE_RULES[locale];
  const targetDate = new Date(isoDate);
  const month = rule.months[targetDate.getUTCMonth()];
  const day = targetDate.getUTCDate();
  const year = targetDate.getUTCFullYear();
  return rule.render(month, day, year, getDaySuffix);
}
// 运行验证：formatByLocale("2020-10-23T13:00:48.207Z", "fr") 输出 "23 Octobre 2020"

如果需要新增其他语言支持，只需要往LOCALE_RULES里追加对应语言的月份数组和拼接逻辑即可，整体代码量不足百行，相比整包引入日期库的体积开销可以忽略不计。

注意：如果业务场景需要处理跨时区、闰年、自定义格式等复杂场景，可以考虑按需引入轻量库，针对仅固定格式的简单展示需求，原生实现完全足够。

内容的提问来源于stack exchange，提问作者HelloWorldEngineer