在本实验中，你将探索强大的 JavaScript Date 对象，并学习操作日期和时间的基本技巧。通过全面的实践方法，你将了解如何使用各种初始化方法创建 Date 对象、获取特定的日期组件、格式化和显示日期信息、使用 setter 方法修改日期，以及执行复杂的日期计算。
本实验提供了关于在 JavaScript 中处理日期的实用、逐步指导，涵盖了从当前时间、特定时间戳、日期字符串和 Unix 纪元以来的毫秒数创建 Date 对象的基本技能。通过本实验的学习，你将掌握日期操作技巧，从而能够在 JavaScript 应用程序中有效地处理与日期相关的任务。
在这一步中，你将学习如何在 JavaScript 中创建新的 Date 对象，这是处理日期和时间的基础。JavaScript 的 Date 对象使你可以轻松地处理日期和时间。
首先，打开 WebIDE 并在 ~/project 目录下创建一个名为 dates.js 的新 JavaScript 文件。
使用不同的初始化方法创建一个新的 Date 对象：
// 创建一个表示当前日期和时间的 Date 对象
let currentDate = new Date();
console.log("Current Date:", currentDate);
// 创建一个具有特定日期和时间的 Date 对象
let specificDate = new Date(2023, 5, 15, 10, 30, 0);
console.log("Specific Date:", specificDate);
// 从日期字符串创建一个 Date 对象
let stringDate = new Date("2023-06-15");
console.log("Date from String:", stringDate);
// 使用自 Unix 纪元以来的毫秒数创建一个 Date 对象
let millisecondDate = new Date(1686816000000);
console.log("Date from Milliseconds:", millisecondDate);示例输出：
Current Date: Thu Jun 15 2023 12:00:00 GMT+0000 (Coordinated Universal Time)
Specific Date: Thu Jun 15 2023 10:30:00 GMT+0000 (Coordinated Universal Time)
Date from String: Thu Jun 15 2023 00:00:00 GMT+0000 (Coordinated Universal Time)
Date from Milliseconds: Thu Jun 15 2023 00:00:00 GMT+0000 (Coordinated Universal Time)需要记住的关键点：
new Date() 创建一个包含当前日期和时间的 Date 对象new Date(year, month, day, hours, minutes, seconds) 允许创建一个特定的日期在这一步中，你将学习如何从 Date 对象中提取特定的组成部分。基于上一步的内容，我们将使用 dates.js 文件来演示获取日期和时间组成部分的各种方法。
打开 ~/project/dates.js 文件并添加以下代码：
// 创建一个当前日期对象
let currentDate = new Date();
// 获取单独的日期组成部分
let year = currentDate.getFullYear();
let month = currentDate.getMonth(); // 0-11 (0 = 一月)
let day = currentDate.getDate(); // 月份中的第几天
let hours = currentDate.getHours();
let minutes = currentDate.getMinutes();
let seconds = currentDate.getSeconds();
let milliseconds = currentDate.getMilliseconds();
// 显示单独的组成部分
console.log("Year:", year);
console.log("Month:", month + 1); // 加 1 以显示实际的月份数字
console.log("Day of Month:", day);
console.log("Hours:", hours);
console.log("Minutes:", minutes);
console.log("Seconds:", seconds);
console.log("Milliseconds:", milliseconds);
// 获取星期几
let dayOfWeek = currentDate.getDay(); // 0-6 (0 = 星期日)
console.log("Day of Week:", dayOfWeek);
// 获取时间戳（自 Unix 纪元以来的毫秒数）
let timestamp = currentDate.getTime();
console.log("Timestamp:", timestamp);示例输出：
Year: 2023
Month: 6
Day of Month: 15
Hours: 12
Minutes: 30
Seconds: 45
Milliseconds: 123
Day of Week: 4
Timestamp: 1686816045123需要记住的关键点：
getFullYear() 返回四位数的年份getMonth() 返回 0-11，因此需要加 1 以显示实际的月份数字getDate() 返回月份中的第几天（1-31）getDay() 返回星期几（0-6）getTime() 返回自 1970 年 1 月 1 日以来的毫秒数在这一步中，你将学习在 JavaScript 中格式化并显示日期信息的多种方法。打开 ~/project/dates.js 文件并添加以下代码，以探索不同的格式化技术：
// 创建一个当前日期对象
let currentDate = new Date();
// 方法 1: 使用 toLocaleDateString()
let localeDateString = currentDate.toLocaleDateString();
console.log("Local Date String:", localeDateString);
// 方法 2: 使用 toDateString()
let dateString = currentDate.toDateString();
console.log("Date String:", dateString);
// 方法 3: 使用 toLocaleString()
let localeString = currentDate.toLocaleString();
console.log("Locale String:", localeString);
// 方法 4: 自定义格式化
let customFormat =
`${currentDate.getFullYear()}-` +
`${(currentDate.getMonth() + 1).toString().padStart(2, "0")}-` +
`${currentDate.getDate().toString().padStart(2, "0")}`;
console.log("Custom Format:", customFormat);
// 方法 5: 国际化 API
let options = {
weekday: "long",
year: "numeric",
month: "long",
day: "numeric"
};
let intlFormat = currentDate.toLocaleDateString("en-US", options);
console.log("Internationalized Format:", intlFormat);示例输出：
Local Date String: 6/15/2023
Date String: Thu Jun 15 2023
Locale String: 6/15/2023, 12:30:45 PM
Custom Format: 2023-06-15
Internationalized Format: Thursday, June 15, 2023需要记住的关键点：
toLocaleDateString() 提供本地化的日期表示toDateString() 提供人类可读的日期字符串toLocaleString() 包含日期和时间在这一步中，你将学习如何使用 JavaScript 的 Date setter 方法修改日期的组成部分。打开 ~/project/dates.js 文件并添加以下代码，以探索修改日期值的不同方法：
// 创建一个新的 Date 对象
let modifiableDate = new Date();
console.log("Original Date:", modifiableDate);
// 设置特定的年份
modifiableDate.setFullYear(2024);
console.log("After setting year:", modifiableDate);
// 设置月份（0-11，因此 5 表示 6 月）
modifiableDate.setMonth(5);
console.log("After setting month:", modifiableDate);
// 设置月份中的第几天
modifiableDate.setDate(15);
console.log("After setting day:", modifiableDate);
// 设置小时（0-23）
modifiableDate.setHours(14);
console.log("After setting hours:", modifiableDate);
// 设置分钟（0-59）
modifiableDate.setMinutes(30);
console.log("After setting minutes:", modifiableDate);
// 设置秒数（0-59）
modifiableDate.setSeconds(45);
console.log("After setting seconds:", modifiableDate);
// 链式调用 setter 方法
let customDate = new Date();
customDate.setFullYear(2025).setMonth(11).setDate(31);
console.log("Custom Date:", customDate);示例输出：
Original Date: Thu Jun 15 2023 12:30:45 GMT+0000
After setting year: Thu Jun 15 2024 12:30:45 GMT+0000
After setting month: Thu Jun 15 2024 12:30:45 GMT+0000
After setting day: Sat Jun 15 2024 12:30:45 GMT+0000
After setting hours: Sat Jun 15 2024 14:30:45 GMT+0000
After setting minutes: Sat Jun 15 2024 14:30:45 GMT+0000
After setting seconds: Sat Jun 15 2024 14:30:45 GMT+0000
Custom Date: Wed Dec 31 2025 00:00:00 GMT+0000需要记住的关键点：
在这一步中，你将学习如何使用 JavaScript 的 Date 方法执行各种日期计算。打开 ~/project/dates.js 文件并添加以下代码，以探索不同的日期操作技术：
// 创建用于计算的日期对象
let currentDate = new Date();
let futureDate = new Date(currentDate.getTime());
// 向日期添加天数
futureDate.setDate(currentDate.getDate() + 30);
console.log("Current Date:", currentDate);
console.log("30 Days from Now:", futureDate);
// 计算日期之间的差异
let differenceInMilliseconds = futureDate.getTime() - currentDate.getTime();
let differenceInDays = Math.floor(
differenceInMilliseconds / (1000 * 60 * 60 * 24)
);
console.log("Days Between Dates:", differenceInDays);
// 计算年龄或经过的时间
let birthDate = new Date("1990-01-01");
let ageInMilliseconds = currentDate.getTime() - birthDate.getTime();
let ageInYears = Math.floor(ageInMilliseconds / (1000 * 60 * 60 * 24 * 365.25));
console.log("Calculated Age:", ageInYears);
// 查找当前月份的最后一天
let lastDayOfMonth = new Date(
currentDate.getFullYear(),
currentDate.getMonth() + 1,
0
);
console.log("Last Day of Current Month:", lastDayOfMonth);
// 检查某年是否为闰年
function isLeapYear(year) {
return new Date(year, 1, 29).getMonth() === 1;
}
console.log("Is 2024 a Leap Year?", isLeapYear(2024));示例输出：
Current Date: Thu Jun 15 2023 12:30:45 GMT+0000
30 Days from Now: Sat Jul 15 2023 12:30:45 GMT+0000
Days Between Dates: 30
Calculated Age: 33
Last Day of Current Month: Wed Jun 30 2023 00:00:00 GMT+0000
Is 2024 a Leap Year? true需要记住的关键点：
getTime() 获取毫秒数以进行计算setDate() 添加或减去天数在本实验中，参与者通过全面探索日期的创建、检索和操作技术，学习了如何使用 JavaScript 的 Date 对象来操作日期。实验涵盖了多种初始化 Date 对象的方法，包括创建表示当前时刻的日期、使用参数指定确切日期、从字符串解析日期以及从毫秒时间戳生成日期。
实践练习展示了关键的 JavaScript 日期处理技能，例如提取特定的日期组成部分、格式化日期信息、应用 setter 方法修改日期以及执行日期计算。参与者通过实际操作，掌握了零索引的月份表示方法，理解了不同的 Date 对象初始化策略，并利用 JavaScript 内置方法在各种编程场景中有效地处理时间数据。
