如何在JavaScript中格式化日期
在JavaScript开发中，日期格式化是非常常见的需求，比如将日期显示为"2024-05-20"或者"2024年5月20日 14:30"这样的格式。JavaScript原生提供了Date对象来处理日期相关操作，我们可以基于Date对象的方法实现基础的日期格式化，也可以借助更便捷的工具函数来满足复杂场景的需求。
原生Date对象基础格式化
Date对象内置了多个获取日期时间各部分的方法，我们可以通过组合这些方法，拼接出需要的日期格式。常用的获取方法包括：getFullYear()获取四位年份，getMonth()获取月份（注意返回值是0-11，需要加1才是实际月份），getDate()获取日期，getHours()获取小时，getMinutes()获取分钟，getSeconds()获取秒数。
下面是一个基础的原生格式化示例，将日期格式化为"YYYY-MM-DD HH:mm:ss"的形式：
function formatDateNative(date) {
// 获取年份
const year = date.getFullYear();
// 获取月份，需要加1，不足两位补0
const month = String(date.getMonth() + 1).padStart(2, '0');
// 获取日期，不足两位补0
const day = String(date.getDate()).padStart(2, '0');
// 获取小时，不足两位补0
const hours = String(date.getHours()).padStart(2, '0');
// 获取分钟，不足两位补0
const minutes = String(date.getMinutes()).padStart(2, '0');
// 获取秒数，不足两位补0
const seconds = String(date.getSeconds()).padStart(2, '0');
// 拼接成目标格式
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
}
// 使用示例
const now = new Date();
console.log(formatDateNative(now)); // 输出类似 2024-05-20 15:45:30这里的padStart是ES2017引入的字符串方法，第一个参数是目标长度，第二个参数是补位的字符，用来把单个数字的月份、日期等补成两位，避免格式不统一的问题。
支持自定义格式的通用函数
如果需要根据不同的场景灵活调整日期格式，比如有时候需要"YYYY/MM/DD"，有时候需要"MM月DD日"，可以封装一个支持占位符替换的通用格式化函数，通过传入格式字符串来指定输出样式。
下面的函数支持YYYY（年）、MM（月）、DD（日）、HH（时）、mm（分）、ss（秒）这些占位符，你可以自由组合这些占位符得到想要的格式：
function formatDate(date, formatStr) {
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 formatStr
.replace('YYYY', year)
.replace('MM', month)
.replace('DD', day)
.replace('HH', hours)
.replace('mm', minutes)
.replace('ss', seconds);
}
// 使用示例
const testDate = new Date('2024-05-20T14:30:00');
console.log(formatDate(testDate, 'YYYY-MM-DD')); // 输出 2024-05-20
console.log(formatDate(testDate, 'YYYY年MM月DD日 HH:mm')); // 输出 2024年05月20日 14:30
console.log(formatDate(testDate, 'YYYY/MM/DD HH:mm:ss')); // 输出 2024/05/20 14:30:00使用第三方库处理复杂场景
如果是处理时区转换、本地化显示、复杂的日期计算等场景，原生Date对象的能力会显得不足，这时候可以使用成熟的第三方日期库，比如day.js，它体积小、API简洁，和moment.js的API类似但更轻量。
使用day.js之前需要先引入库，如果是前端项目可以通过script标签引入，或者在Node.js环境中通过npm安装后引入。下面是使用day.js格式化的示例：
// 假设已经引入day.js，这里模拟引入后的使用
// const dayjs = require('dayjs'); // Node.js环境
// 或者 <script src="https://cdn.jsdelivr.net/npm/dayjs@1.11.10/dayjs.min.js"></script> 浏览器环境
const date = new Date();
// 格式化为 YYYY-MM-DD HH:mm:ss
const formatted1 = dayjs(date).format('YYYY-MM-DD HH:mm:ss');
console.log(formatted1); // 输出类似 2024-05-20 16:10:45
// 格式化为本地化中文日期
const formatted2 = dayjs(date).format('YYYY年MM月DD日 HH时mm分ss秒');
console.log(formatted2); // 输出类似 2024年05月20日 16时10分45秒
// 获取相对时间，比如"3分钟前"
const relativeTime = dayjs(date).fromNow();
console.log(relativeTime);day.js的format方法支持的占位符更丰富，还能处理时区、本地化等复杂需求，适合中大型项目使用。
注意事项
- Date对象的getMonth()返回值范围是0-11，对应1月到12月，格式化的时候一定要记得加1，避免出现月份少1的问题。
- 如果传入的日期字符串不符合规范，new Date()可能会返回Invalid Date，使用前最好先判断日期是否有效，可以通过isNaN(date.getTime())来判断。
- 涉及时区的问题时，原生Date对象默认使用运行环境的本地时区，如果需要处理UTC时间或者其他时区，建议使用第三方库，避免手动计算出现错误。