跳到主要内容

JavaScript 日期设置方法

在JavaScript中，操作日期和时间是常见任务。无论是创建预约系统、倒计时器，还是记录用户活动时间，都需要掌握如何设置和修改日期值。本文将详细介绍JavaScript中用于设置日期和时间的各种方法。

日期对象基础​

在了解设置方法之前，我们需要先创建一个日期对象。在JavaScript中，可以通过Date构造函数创建日期对象：

javascript
// 创建表示当前时间的日期对象
const today = new Date();
console.log(today); // 输出例如: Tue Mar 22 2023 15:30:45 GMT+0800 (中国标准时间)

// 创建特定日期的日期对象
const specificDate = new Date(2023, 2, 22); // 注意：月份是从0开始的，2表示3月
console.log(specificDate); // 输出: Wed Mar 22 2023 00:00:00 GMT+0800 (中国标准时间)
备注

JavaScript中的月份是从0开始计数的，因此1月是0，12月是11。这是初学者常犯的错误，请特别注意！

设置日期方法概览​

JavaScript提供了一系列set方法来修改日期对象的各个部分：

  1. 设置年、月、日
  2. 设置时、分、秒、毫秒
  3. 组合设置方法

下面将详细介绍每一类方法。

设置年月日的方法​

setFullYear()​

setFullYear()方法用于设置日期对象的年份，还可选择性地设置月份和日期。

javascript
const date = new Date();
date.setFullYear(2025);
console.log(date); // 显示2025年的当前日期和时间

// 同时设置年、月、日
date.setFullYear(2025, 0, 15); // 设置为2025年1月15日
console.log(date);

setMonth()​

setMonth()方法用于设置日期对象的月份（0-11）。

javascript
const date = new Date();
date.setMonth(5); // 设置为6月
console.log(date);

// 可以同时设置月和日
date.setMonth(5, 20); // 设置为6月20日
console.log(date);

setDate()​

setDate()方法用于设置日期对象的日期（1-31）。

javascript
const date = new Date();
date.setDate(15); // 设置为当月15日
console.log(date);

// 超出当月天数会自动调整到下个月
date.setDate(32); // 如果当月有31天，这将设置为下月1日
console.log(date);
提示

使用setDate(0)会将日期设置为上个月的最后一天，这是一个获取月末日期的技巧！

设置时间的方法​

setHours()​

setHours()方法用于设置日期对象的小时（0-23）。

javascript
const date = new Date();
date.setHours(14); // 设置为14点（下午2点）
console.log(date);

// 可同时设置时、分、秒、毫秒
date.setHours(14, 30, 0, 0); // 14:30:00.000
console.log(date);

setMinutes()​

setMinutes()方法用于设置日期对象的分钟（0-59）。

javascript
const date = new Date();
date.setMinutes(30); // 设置为当前小时的30分
console.log(date);

// 可同时设置分、秒、毫秒
date.setMinutes(45, 30, 0); // 设置为当前小时的45分30秒
console.log(date);

setSeconds()​

setSeconds()方法用于设置日期对象的秒数（0-59）。

javascript
const date = new Date();
date.setSeconds(30); // 设置为当前分钟的第30秒
console.log(date);

// 可同时设置秒和毫秒
date.setSeconds(45, 500); // 设置为45.5秒
console.log(date);

setMilliseconds()​

setMilliseconds()方法用于设置日期对象的毫秒数（0-999）。

javascript
const date = new Date();
date.setMilliseconds(500); // 设置为当前秒的第500毫秒
console.log(date);

设置时间戳​

setTime()​

setTime()方法接受一个表示从1970年1月1日00:00:00 UTC起的毫秒数，并将日期设置为该时间戳对应的时间。

javascript
const date = new Date();
// 设置为2023年1月1日
date.setTime(1672531200000); // 2023年1月1日的时间戳
console.log(date);

设置UTC时间的方法​

每个上述方法都有对应的UTC版本，用于设置协调世界时(UTC)的日期和时间：

  • setUTCFullYear()
  • setUTCMonth()
  • setUTCDate()
  • setUTCHours()
  • setUTCMinutes()
  • setUTCSeconds()
  • setUTCMilliseconds()
javascript
const date = new Date();
date.setUTCHours(12); // 设置为UTC时间12点（可能不是本地时间12点）
console.log(date);

实际应用场景​

场景1：创建约会提醒系统​

javascript
function createAppointmentReminder(appointmentDate) {
  const reminder = new Date(appointmentDate);
  // 设置提醒时间为约会前1小时
  reminder.setHours(reminder.getHours() - 1);
  
  const now = new Date();
  
  if (reminder > now) {
    const timeUntilReminder = reminder.getTime() - now.getTime();
    console.log(`预约时间: ${appointmentDate}`);
    console.log(`提醒将在${Math.floor(timeUntilReminder / (1000 * 60))}分钟后发送`);
    
    // 实际应用中，这里可以使用setTimeout设置提醒
    setTimeout(() => {
      console.log("提醒：您有一个约会即将在1小时后开始！");
    }, timeUntilReminder);
  }
}

// 使用示例
const tomorrow = new Date();
tomorrow.setDate(tomorrow.getDate() + 1);
tomorrow.setHours(14, 0, 0); // 明天下午2点的约会
createAppointmentReminder(tomorrow);

场景2：计算截止日期​

javascript
function calculateDueDate(startDate, daysAllowed) {
  const dueDate = new Date(startDate);
  dueDate.setDate(dueDate.getDate() + daysAllowed);
  
  // 确保截止日期不落在周末
  const dayOfWeek = dueDate.getDay(); // 0是周日，6是周六
  
  if (dayOfWeek === 0) { // 如果是周日
    dueDate.setDate(dueDate.getDate() + 1); // 改为周一
  } else if (dayOfWeek === 6) { // 如果是周六
    dueDate.setDate(dueDate.getDate() + 2); // 改为周一
  }
  
  return dueDate;
}

// 使用示例
const projectStart = new Date(2023, 2, 15); // 2023年3月15日
const deadline = calculateDueDate(projectStart, 10); // 10个工作日后
console.log(`项目开始日期: ${projectStart.toDateString()}`);
console.log(`截止日期: ${deadline.toDateString()}`);

场景3：创建日期选择器​

javascript
function generateDateOptions(startDate, daysToInclude) {
  const options = [];
  const currentDate = new Date(startDate);
  
  for (let i = 0; i < daysToInclude; i++) {
    // 复制日期对象避免修改原始对象
    const dateOption = new Date(currentDate);
    
    // 格式化为易读的日期字符串
    const dateString = dateOption.toLocaleDateString('zh-CN', {
      year: 'numeric',
      month: 'long',
      day: 'numeric',
      weekday: 'long'
    });
    
    options.push({
      date: dateOption,
      display: dateString
    });
    
    // 增加一天
    currentDate.setDate(currentDate.getDate() + 1);
  }
  
  return options;
}

// 使用示例
const today = new Date();
const availableDates = generateDateOptions(today, 7); // 生成未来7天的选项

// 显示可选日期
availableDates.forEach(option => {
  console.log(option.display);
});

处理常见问题​

问题1：月末溢出​

当你设置的日期超过目标月份的天数时，JavaScript会自动调整到下个月：

javascript
const date = new Date(2023, 1, 15); // 2023年2月15日
console.log(date.toDateString());

date.setDate(30); // 2月没有30日，将自动调整
console.log(date.toDateString()); // 显示为3月2日或3月1日（取决于是否为闰年）

问题2：处理DST（夏令时）​

在涉及夏令时转换的日期上设置时间时要格外小心：

javascript
// 这只是一个示例，具体日期取决于您所在国家/地区的夏令时规则
const dstTransitionDate = new Date(2023, 2, 26, 1, 30, 0); // 大约是欧洲夏令时开始的日期
console.log(dstTransitionDate.toString());

// 增加1小时，可能会显示为增加了2小时（因为夏令时）
dstTransitionDate.setHours(dstTransitionDate.getHours() + 1);
console.log(dstTransitionDate.toString());

总结​

JavaScript提供了多种方法来设置日期和时间的各个部分：

  1. setFullYear()、setMonth()、setDate() - 设置年、月、日
  2. setHours()、setMinutes()、setSeconds()、setMilliseconds() - 设置时、分、秒、毫秒
  3. setTime() - 通过时间戳设置整个日期
  4. 各种对应的UTC方法 - 设置协调世界时

这些方法使我们能够灵活地操作日期对象，满足各种业务需求。在使用这些方法时，需要注意月份是从0开始的，以及日期溢出和夏令时的处理。

警告

修改日期对象时，请记住这些方法会直接修改原始对象，如果需要保留原始日期，应该先创建一个副本。

练习题​

  1. 创建一个函数，接受一个日期参数，并返回该日期所在月份的最后一天。
  2. 编写一个函数，计算指定日期后的90个工作日（不包括周末）是哪一天。
  3. 创建一个倒计时函数，计算当前时间距离下一个新年还有多少天、小时、分钟和秒。

额外资源​

掌握这些日期设置方法后，你将能够在JavaScript应用程序中轻松处理各种日期和时间相关的操作！