JavaScript 中处理日期格式化

在 JavaScript 中处理日期格式化，原生能力确实有限，但现代的 Intl 对象提供了不错的基础支持。对于更复杂或要求高的场景，社区一些优秀的库能让你事半功倍。

下面这个表格整理了主要的日期格式化方案，帮你快速了解：

方案类型	代表库/方法	核心特点	适用场景
原生 JS 方案	Intl.DateTimeFormat	浏览器内置，支持国际化，无需额外依赖	简单的、对包体积敏感的需求
	手动拼接	完全控制输出格式，代码灵活	极简单的特定格式，且不愿引入任何工具
第三方库	Day.js	轻量（仅 2kB），API 与 Moment.js 相似	绝大多数项目，平衡功能与体积
	date-fns	函数式、模块化，按需引入	模块化项目，追求 tree shaking
	Moment.js	功能极其全面，社区资源丰富	遗留项目，或需要处理非常复杂的日期时间

💻 原生 JavaScript 方案

如果需求简单，或者你特别在意包大小，原生能力基本够用。

1. Intl.DateTimeFormat (推荐)
   这是目前浏览器原生方法里最强大和现代的，尤其擅长处理国际化。

   const date = new Date();
   const formatter = new Intl.DateTimeFormat('zh-CN', {
     year: 'numeric',
     month: '2-digit',
     day: '2-digit',
     hour: '2-digit',
     minute: '2-digit',
     second: '2-digit',
     hour12: false // 使用24小时制
   });
   console.log(formatter.format(date)); // 输出示例： "2023/10/05 15:24:00"
   

2. 手动拼接
   这种方式就是直接获取日期的各个部分，然后拼成你想要的字符串。

   function formatDate(date) {
     const year = date.getFullYear();
     const month = String(date.getMonth() + 1).padStart(2, '0');
     const day = String(date.getDate()).padStart(2, '0');
     const hours = String(date.getHours()).padStart(2, '0');
     const minutes = String(date.getMinutes()).padStart(2, '0');
     const seconds = String(date.getSeconds()).padStart(2, '0');
   
     return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
   }
   
   console.log(formatDate(new Date())); // 输出示例： "2023-10-05 15:24:00"
   

   缺点也很明显：代码相对繁琐，处理12小时制、时区、本地化等会很麻烦。

🧰 第三方库推荐

当原生方法无法满足需求时，下面这些库是更好的选择。

1. Day.js：现代轻量之选

   • 优势：API 设计友好，体积极小，可以通过插件扩展功能（如时区、相对时间等）。
   • 示例：

     import dayjs from 'dayjs';
     
     console.log(dayjs().format('YYYY-MM-DD')); // 输出示例："2025-03-26"
     console.log(dayjs().format('YYYY-MM-DD HH:mm:ss')); // 输出示例："2025-06-05 10:00:00"
     

2. date-fns：模块化工具集

   • 优势：函数式编程风格，利于 tree shaking，特别适合在模块化打包的项目中使用，可以只引入你用到的方法。
   • 示例：

     import { format } from 'date-fns';
     
     console.log(format(new Date(), 'yyyy-MM-dd HH:mm:ss')); // 输出示例："2023-06-05 10:00:00"
     

💎 如何选择？

• 追求小巧、易上手，应对大部分日常场景：直接选择 Day.js。
• 项目基于模块化构建，且注重代码最优打包：可以考虑 date-fns。
• 处理简单日期显示，且不希望任何外部依赖：使用原生的 Intl.DateTimeFormat。
• 维护老项目，或需要进行极其复杂的日期操作（如大量历史时区转换）：才考虑 Moment.js。