网站跟网页的区别网站策划案内容
目录
一、实例化日期对象
1. 无参数：获取当前时间
2. 传入时间戳
3. 传入日期字符串
4. 传入年月日时分秒
5. 其他格式
二、日期对象常用方法
1. 获取日期时间分量
2. 设置日期时间分量
3. UTC 方法
4. 日期格式化
三、时间戳（Timestamp）
1. 获取时间戳
2. 时间戳转换日期
3. 计算时间差
四、常见场景与注意事项
1. 月份索引从 0 开始
2. 日期比较
3. 时区处理
示例：实时倒计时
JavaScript 中的
Date对象用于处理日期和时间，支持创建、操作和格式化日期。
一、实例化日期对象
1. 无参数：获取当前时间
const now = new Date();
console.log(now); // 输出当前本地时间，如：Fri Jul 12 2024 14:30:45 GMT+0800 (中国标准时间)2. 传入时间戳
时间戳是从 1970-1-1 00:00:00 UTC 至今的毫秒数。
const timestamp = 1720785600000; // 代表 2024-07-12 12:00:00 UTC
const dateFromTimestamp = new Date(timestamp);
console.log(dateFromTimestamp); // 转换为本地时间3. 传入日期字符串
支持符合规范的日期字符串（如 ISO 8601 格式）。
const dateFromString = new Date("2024-07-12T12:00:00Z"); // UTC 时间
console.log(dateFromString); // 转换为本地时间4. 传入年月日时分秒
注意：月份从 0 开始（0 代表 1 月，11 代表 12 月）。
// 语法：new Date(year, monthIndex, day, hours, minutes, seconds, milliseconds)
const specificDate = new Date(2024, 6, 12, 14, 30, 0); // 2024年7月12日 14:30:00
console.log(specificDate);5. 其他格式
// 仅传入年月日
const datePart = new Date(2024, 6, 12); // 2024-07-12 00:00:00// 使用逗号分隔参数
const dateWithParams = new Date(2024, 6, 12, 14, 30); // 2024-07-12 14:30:00二、日期对象常用方法
1. 获取日期时间分量
| 方法 | 说明 | 示例 |
|---|---|---|
getFullYear() | 获取四位年份（推荐） | 2024 |
getMonth() | 获取月份（0-11） | 6（代表7月） |
getDate() | 获取月份中的第几天（1-31） | 12 |
getHours() | 获取小时（0-23） | 14 |
getMinutes() | 获取分钟（0-59） | 30 |
getSeconds() | 获取秒（0-59） | 0 |
getMilliseconds() | 获取毫秒（0-999） | 500 |
getDay() | 获取星期几（0-6，0=周日） | 5（代表周六） |
示例：
const date = new Date(2024, 6, 12, 14, 30, 45, 500);
console.log(date.getFullYear()); // 2024
console.log(date.getMonth()); // 6（7月）
console.log(date.getDate()); // 12
console.log(date.getDay()); // 5（周六）2. 设置日期时间分量
| 方法 | 说明 |
|---|---|
setFullYear(year) | 设置年份 |
setMonth(month) | 设置月份（0-11） |
setDate(day) | 设置月份中的第几天 |
setHours(hours) | 设置小时（可连锁设置其他分量） |
示例：
const date = new Date();
date.setFullYear(2025);
date.setMonth(11); // 设置为12月
date.setDate(31); // 设置为31号
console.log(date); // 2025-12-31 ...3. UTC 方法
处理 UTC 时间（世界标准时间）：
const date = new Date();
console.log(date.getUTCFullYear()); // UTC 年份
console.log(date.getUTCHours()); // UTC 小时4. 日期格式化
| 方法 | 说明 | 示例输出 |
|---|---|---|
toString() | 完整日期时间字符串 | Fri Jul 12 2024 14:30:45 GMT+0800 |
toDateString() | 仅日期部分 | Fri Jul 12 2024 |
toTimeString() | 仅时间部分 | 14:30:45 GMT+0800 |
toISOString() | ISO 8601 格式的 UTC 时间 | 2024-07-12T06:30:45.000Z |
toLocaleDateString() | 本地格式的日期 | 2024/7/12 |
toLocaleTimeString() | 本地格式的时间 | 14:30:45 |
示例：
const date = new Date();
console.log(date.toISOString()); // 2024-07-12T06:30:45.000Z
console.log(date.toLocaleDateString()); // 2024/7/12（根据系统区域设置）三、时间戳（Timestamp）
1. 获取时间戳
| 方法 | 说明 |
|---|---|
Date.now() | 当前时间戳（毫秒） |
date.getTime() | 日期对象对应的时间戳 |
date.valueOf() | 等价于 getTime() |
示例：
const timestamp1 = Date.now(); // 当前时间戳
const date = new Date();
const timestamp2 = date.getTime(); // 等同于 date.valueOf()
console.log(+new Date());2. 时间戳转换日期
const timestamp = 1720785600000;
const date = new Date(timestamp);
console.log(date.toISOString()); // 2024-07-12T12:00:00.000Z3. 计算时间差
const start = Date.now();
// 执行一些操作...
const end = Date.now();
const duration = end - start; // 毫秒级耗时
console.log(`耗时：${duration}ms`);四、常见场景与注意事项
1. 月份索引从 0 开始
// 错误写法：将 7 月写成 7
const wrongDate = new Date(2024, 7, 12); // 实际是 8月12日// 正确写法：7 月对应 6
const correctDate = new Date(2024, 6, 12); // 7月12日2. 日期比较
直接比较日期对象或时间戳：
const date1 = new Date(2024, 6, 12);
const date2 = new Date(2024, 6, 15);
console.log(date1 < date2); // true// 或比较时间戳
console.log(date1.getTime() < date2.getTime()); // true3. 时区处理
-
转换为 UTC 时间：
const date = new Date(); console.log(date.toISOString()); // UTC 时间 -
解析 UTC 时间字符串：
const utcDate = new Date("2024-07-12T12:00:00Z"); // 明确指定 UTC
示例：实时倒计时
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>实时倒计时</title><style>#countdown {font-size: 24px;font-family: Arial, sans-serif;padding: 20px;background: #f0f0f0;border-radius: 8px;display: inline-block;}.time-unit {margin: 0 10px;padding: 5px 10px;background: white;border-radius: 4px;}</style>
</head><body><h2>距离2026年元旦还有：</h2><div id="countdown"><span class="time-unit" id="days">00</span>天<span class="time-unit" id="hours">00</span>小时<span class="time-unit" id="minutes">00</span>分<span class="time-unit" id="seconds">00</span>秒</div><script>// 目标时间：2026年1月1日 00:00:00 (本地时间)const targetDate = new Date(2026, 0, 1, 0, 0, 0);// 获取显示元素const daysElement = document.getElementById('days');const hoursElement = document.getElementById('hours');const minutesElement = document.getElementById('minutes');const secondsElement = document.getElementById('seconds');// 时间格式化函数（补零）function formatTime(number) {return number.toString().padStart(2, '0');}// 倒计时计算函数function updateCountdown() {const currentDate = new Date();const timeDifference = targetDate - currentDate;if (timeDifference <= 0) {clearInterval(timer);document.getElementById('countdown').innerHTML = "新年快乐！";return;}// 计算时间分量const seconds = Math.floor(timeDifference / 1000) % 60;const minutes = Math.floor(timeDifference / (1000 * 60)) % 60;const hours = Math.floor(timeDifference / (1000 * 60 * 60)) % 24;const days = Math.floor(timeDifference / (1000 * 60 * 60 * 24));// 更新显示daysElement.textContent = formatTime(days);hoursElement.textContent = formatTime(hours);minutesElement.textContent = formatTime(minutes);secondsElement.textContent = formatTime(seconds);}// 立即执行一次避免初始空白updateCountdown();// 启动定时器（每秒更新）var timer = setInterval(updateCountdown, 1000);</script>
</body></html>