JS 日期处理
学习 Date 对象和日期格式化 · 难度:入门 · +10XP
JavaScript 日期处理完全指南
在 JavaScript 中处理日期和时间,主要使用内置的 Date 对象。无论是显示文章发布日期、计算活动倒计时、还是格式化时间戳,Date 对象都是核心工具。虽然原生 API 有些设计上的怪癖(比如月份从 0 开始计数),但掌握这些方法足以应对绝大多数业务场景。
创建 Date 对象的四种方式
创建 Date 对象有四种常用方式,分别适用于不同的数据来源。注意:不传参数时创建的是当前时刻的日期对象;传入月份参数时0 代表一月,11 代表十二月。
// 方式一:获取当前日期时间
let now = new Date();
console.log(now); // 例如: Sat May 30 2026 16:00:00 GMT+0800
// 方式二:通过时间戳(毫秒数,从 1970-01-01 00:00:00 UTC 起算)
let d2 = new Date(1717113600000); // 指定毫秒数
console.log(d2); // 对应那个时刻的日期
// 方式三:通过日期字符串(格式灵活但结果因浏览器而异)
let d3 = new Date('2026-01-15'); // 推荐格式 YYYY-MM-DD
let d4 = new Date('2026-01-15T10:30:00'); // 带时间的 ISO 格式
// 方式四:分别指定年、月、日、时、分、秒、毫秒
// 注意:月份 = 实际月份 - 1!
let d5 = new Date(2026, 0, 15, 10, 30, 0, 0);
// 年份 月份(0=1月) 日 时 分 秒 毫秒
console.log(d5); // 2026年1月15日 10:30:00
获取日期各个部分
Date 对象提供了丰富的 get 方法族来获取日期和时间各组成部分。所有 get 方法都基于本地时区,如果需要 UTC 时间可以使用对应的 getUTC... 方法。
| 方法 | 返回值 | 说明 |
|---|---|---|
| getFullYear() | 4位数年份 | 如 2026,推荐使用而非 getYear() |
| getMonth() | 0-11 | 0=1月, 11=12月 —— 显示时记得+1 |
| getDate() | 1-31 | 当月第几天 |
| getDay() | 0-6 | 0=星期日, 1=星期一, ..., 6=星期六 |
| getHours() | 0-23 | 小时(24小时制) |
| getMinutes() | 0-59 | 分钟 |
| getSeconds() | 0-59 | 秒 |
| getMilliseconds() | 0-999 | 毫秒 |
| getTime() | 毫秒时间戳 | 自 1970-01-01 00:00:00 UTC 起的毫秒数 |
let now = new Date();
console.log('年份:', now.getFullYear()); // 2026
console.log('月份:', now.getMonth() + 1); // 当前月份(不要忘记+1!)
console.log('日期:', now.getDate()); // 当天的日
console.log('星期:', now.getDay()); // 0=周日, 6=周六
console.log('时间:', now.getHours() + ':' + now.getMinutes());
日期的加减运算与比较
日期计算的核心思路:通过 getTime() 获取毫秒时间戳,进行数学运算后,再用 new Date(timestamp) 构造回日期对象。所有日期比较也都基于时间戳的大小。
// 7天后是几号?
let today = new Date();
let weekLater = new Date(today.getTime() + 7 * 24 * 60 * 60 * 1000);
console.log(weekLater);
// 计算两个日期之间相差的天数
function daysBetween(d1, d2) {
let diff = Math.abs(d2.getTime() - d1.getTime());
return Math.floor(diff / (1000 * 60 * 60 * 24));
}
let start = new Date('2026-01-01');
let end = new Date('2026-12-31');
console.log(daysBetween(start, end)); // 364
// 计算一个人的年龄
function getAge(birthDate) {
let today = new Date();
let age = today.getFullYear() - birthDate.getFullYear();
let mDiff = today.getMonth() - birthDate.getMonth();
// 如果还没到今年的生日,年龄减一
if (mDiff < 0 || (mDiff === 0 && today.getDate() < birthDate.getDate())) {
age--;
}
return age;
}
console.log(getAge(new Date('2000-05-20'))); // 今年减去2000
// 日期比较——直接用 > < 即可(底层比较时间戳)
let d1 = new Date('2026-06-01');
let d2 = new Date('2026-09-01');
console.log(d1 < d2); // true(6月早于9月)
console.log(d1 > d2); // false
格式化日期输出
JavaScript 原生没有像 Java SimpleDateFormat 那样的 format 方法,需要手动拼接。常用 padStart(2, '0') 来补零,或使用 toLocaleDateString 快速获得本地化显示。
// 手动格式化为 YYYY-MM-DD HH:mm:ss
function formatDate(date) {
let y = date.getFullYear();
let m = String(date.getMonth() + 1).padStart(2, '0');
let d = String(date.getDate()).padStart(2, '0');
let h = String(date.getHours()).padStart(2, '0');
let min = String(date.getMinutes()).padStart(2, '0');
let s = String(date.getSeconds()).padStart(2, '0');
return ${y}-${m}-${d} ${h}:${min}:${s};
}
console.log(formatDate(new Date())); // "2026-05-30 16:00:00"
// 本地化格式化(根据用户浏览器语言环境)
console.log(new Date().toLocaleDateString('zh-CN')); // "2026/5/30"
console.log(new Date().toLocaleTimeString('zh-CN')); // "16:00:00"
console.log(new Date().toLocaleString('zh-CN')); // "2026/5/30 16:00:00"
// 中文星期名
function getChineseDay(date) {
let days = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
return days[date.getDay()];
}
console.log(getChineseDay(new Date())); // 对应今天的星期
- 日期格式化函数:编写 formatDateCN(date),返回中文格式 "2026年05月30日 星期一 16:00:00",其中星期需自行用数组转换,月份和日期不足两位需补零。
- 倒计时计算:编写 countdown(targetDate),计算距离目标日期还有 X 天 Y 小时 Z 分钟,输入 "2026-10-01",返回 "距离国庆节还有 124 天 8 小时 0 分钟"。
- 判断闰年:编写 isLeapYear(year),利用 Date 对象的特性判断是否为闰年。提示:尝试构造该年2月29日,如果 getDate() 返回 29 则为闰年,返回 3月1日则不是。
- 当月日历:编写 printCalendar(year, month),用 console.log 输出指定年月的日历,显示每天的日期和星期。需要正确处理大小月、闰年2月等边界情况。
- 友好时间显示:编写 timeAgo(dateStr),输入一个过去的时间,返回 "刚刚"、"5分钟前"、"3小时前"、"2天前"、"1个月前" 等社交媒体常用格式。超过一年的显示完整日期。