当前位置：首页 > news >正文

JavaScript 中处理日期格式化

news 2025/10/17 16:21:05

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

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

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

💻 原生 JavaScript 方案

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

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"

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

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小时制、时区、本地化等会很麻烦。

🧰 第三方库推荐

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

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"

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"
```