⚡ 编程实验室🏗️ HTML🎨 CSS⚡ JavaScript🐍 Python🗄️ SQL☕ Java⚛️ React💚 Vue🟢 Node.js⚙️ C语言🐘 PHP🐹 Go🔷 TypeScript🐬 MySQL🔧 C++🎯 C#🦀 Rust🅱️ Bootstrap💡 jQuery🎸 Django🍃 MongoDB👗 Sass🎪 Kotlin📊 R语言📋 XML📊 Excel🐘 PostgreSQL🐳 Docker🅰️ Angular🎮 游戏🏠 网站首页

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-110=1月, 11=12月 —— 显示时记得+1
getDate()1-31当月第几天
getDay()0-60=星期日, 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())); // 对应今天的星期

  1. 日期格式化函数:编写 formatDateCN(date),返回中文格式 "2026年05月30日 星期一 16:00:00",其中星期需自行用数组转换,月份和日期不足两位需补零。
  2. 倒计时计算:编写 countdown(targetDate),计算距离目标日期还有 X 天 Y 小时 Z 分钟,输入 "2026-10-01",返回 "距离国庆节还有 124 天 8 小时 0 分钟"。
  3. 判断闰年:编写 isLeapYear(year),利用 Date 对象的特性判断是否为闰年。提示:尝试构造该年2月29日,如果 getDate() 返回 29 则为闰年,返回 3月1日则不是。
  4. 当月日历:编写 printCalendar(year, month),用 console.log 输出指定年月的日历,显示每天的日期和星期。需要正确处理大小月、闰年2月等边界情况。
  5. 友好时间显示:编写 timeAgo(dateStr),输入一个过去的时间,返回 "刚刚"、"5分钟前"、"3小时前"、"2天前"、"1个月前" 等社交媒体常用格式。超过一年的显示完整日期。
Ctrl+Enter
🚀 升级VIP
解锁全部课程+AI助手

🏆 学习排行

加载中...

📊 统计

📖 231 篇
0 完成
🔥 0