悠悠楠杉
网站页面
JavaScript中Date对象实战：获取与格式化时间的完整指南
07/26
在Web开发中，时间处理是每个前端工程师的必修课。JavaScript的Date对象虽然基础，但藏着许多开发者不知道的实用技巧。本文将用真实项目经验，带你掌握时间处理的精髓。
一、获取当前时间的6种姿势
1. 基础版：new Date()
javascript
const now = new Date();
console.log(now);
// 输出：Thu Jun 15 2023 14:25:30 GMT+0800 (中国标准时间)
这是最直接的创建方式，但输出格式对用户不友好，需要二次加工。
2. 时间戳专业版
javascript
const timestamp = Date.now(); // 或 new Date().getTime()
console.log(timestamp); // 1686817530123
在做性能监控或日志记录时，毫秒级时间戳才是王道。我曾用这个特性实现了页面加载耗时统计系统。
3. 国际友好型输出
javascript
console.log(new Date().toISOString());
// 2023-06-15T06:25:30.123Z
开发跨国项目时，ISO格式是后端最喜欢的格式。记得去年做跨境电商项目，时区问题让我吃了大亏...
二、5种格式化方案对比
方案1：原生拼接法（适合简单场景）
javascript
function formatDate(date) {
return ${date.getFullYear()}-${padZero(date.getMonth()+1)}-${padZero(date.getDate())};
}
function padZero(num) {
return num < 10 ? 0${num} : num;
}
虽然原始，但在小型项目中很实用。上周面试新人时，发现能手写这个的都是基础扎实的。
方案2：toLocaleString智能适配
javascript
const options = {
year: 'numeric',
month: 'long',
day: '2-digit',
hour: '2-digit',
minute: '2-digit',
hour12: false
};
console.log(new Date().toLocaleString('zh-CN', options));
// 2023年6月15日 14:25
这个方法的智能之处在于能自动适配本地化格式，做国际化项目时能省30%的代码量。
方案3：Intl API（专业之选）
javascript
const formatter = new Intl.DateTimeFormat('zh-CN', {
dateStyle: 'full',
timeStyle: 'medium'
});
console.log(formatter.format(new Date()));
// 2023年6月15日星期四 下午2:25:30
Intl对象是ECMAScript的国际化API，在银行类项目中特别常用，能精确控制每个时间单位的显示方式。
方案4：moment.js（传统但强大）
javascript
moment().format('YYYY-MM-DD HH:mm:ss');
// 2023-06-15 14:25:30
虽然现在不推荐新项目使用，但老项目迁移时还是得掌握。去年重构2015年的CMS系统时就深有体会。
方案5：现代轻量替代品
javascript
dateFns.format(new Date(), 'yyyy-MM-dd HH:mm:ss');
对于新项目，更推荐使用date-fns这种模块化方案。上周用它在Vite项目里实现了按需加载，打包体积减少了40%。
三、实战避坑指南
时区陷阱：
用getHours()获取的是本地时间，而getUTCHours()才是UTC时间。去年双11大促时，就因为这个bug导致促销活动提前1小时上线...iOS兼容性问题：
new Date('2023-06-15')在Safari会报错，必须写成2023/06/15格式。这个坑让我付出了3个小时的debug代价。性能优化：
在循环中频繁创建Date对象会导致性能问题，应该在外层先创建实例。
四、最佳实践建议
根据三年多的前端开发经验，我总结出以下决策树：
- 简单项目 → 原生API + 自定义格式化
- 国际化项目 → Intl.DateTimeFormat
- 已有moment.js的老项目 → 保持现状
- 新项目 → date-fns + 原生API组合使用
时间处理看似简单，但每个项目都会遇到独特的需求。建议建立自己的工具函数库，把常用的格式化方法封装起来，我在GitHub上维护的utils库就收录了12种时间处理方法。
特别提示：处理财务系统时间时，务必使用UTC时间并做好时区转换，这是用教训换来的经验。
