添加链接
link管理
链接快照平台
  • 输入网页链接,自动生成快照
  • 标签化管理网页链接

如何在JavaScript日期中添加分钟、小时或天数?

在Web开发中,你很难避免遇到需要 操作日期 的情况。也许你需要显示一个交付日期或截止日期。尽管听起来很简单,但JavaScript并没有提供一个特别友好的API来处理这些任务。但是,只要稍加巧妙,这些问题都能迎刃而解。

[!NOTE]

你可能不熟悉JavaScript的 数字分隔符 ,它在下面的示例中使用。它们是使大型数字值更易读的 语法糖

添加秒到日期

Date 对象内置了 Date.prototype.getTime() Date.prototype.setTime() 方法。这两个方法允许我们 获取日期对象的当前时间 设置日期对象的时间

所有的值都是以 毫秒 为单位的,所以在设置时间之前,我们需要将秒数乘以 1000 。然而,请注意 设置时间会改变对象 ,所以我们还需要创建一个新的 Date 对象,以避免改变原始对象。

const addSecondsToDate = (date, n) => {
  const d = new Date(date);
  d.setTime(d.getTime() + n * 1000);
  return d;
addSecondsToDate(new Date('2020-10-19 12:00:00'), 10);
// 2020-10-19 12:00:10
addSecondsToDate(new Date('2020-10-19 12:00:00'), -10);
// 2020-10-19 11:59:50

添加分钟到日期

与秒类似,我们可以在设置时间之前将分钟数乘以一分钟的毫秒数(1000 * 60)来添加分钟到日期。

const addMinutesToDate = (date, n) => {
  const d = new Date(date);
  d.setTime(d.getTime() + n * 60_000);
  return d;
addMinutesToDate('2020-10-19 12:00:00', 10);
// 2020-10-19 12:10:00
addMinutesToDate('2020-10-19 12:00:00', -10);
// 2020-10-19 11:50:00

添加小时到日期

要添加小时到日期,我们可以在设置时间之前将一个小时的毫秒数(1000 * 60 * 60)乘以数量。

const addHoursToDate = (date, n) => {
  const d = new Date(date);
  d.setTime(d.getTime() + n * 3_600_000);
  return d;
addHoursToDate('2020-10-19 12:00:00', 10);
// 2020-10-19 22:00:00
addHoursToDate('2020-10-19 12:00:00', -10);
// 2020-10-19 02:00:00

添加天到日期

对于较大的值,如天数,我们可以使用Date.prototype.getDate()Date.prototype.setDate()

const addDaysToDate = (date, n) => {
  const d = new Date(date);
  d.setDate(d.getDate() + n);
  return d;
addDaysToDate('2020-10-15', 10);
// 2020-10-25
addDaysToDate('2020-10-15', -10);
// 2020-10-05

添加工作日到日期

工作日的计算稍微复杂一些。我们将使用之前的代码片段来添加所需的天数。

在这之前,我们将使用Math.sign()来确定我们应该添加(+1)还是减去(-1)天数。然后,我们将使用Array.from()来创建一个长度等于n的数组,绝对值为n

最后,我们将使用Array.prototype.reduce()来迭代数组,从date开始递增,使用addDaysToDate()。如果某一天不是工作日,我们将根据需要添加或减去另一天,直到找到一个工作日。

const isWeekday = date => date.getDay() % 6 !== 0;
const addWeekDays = (date, n) => {
  const s = Math.sign(n);
  const d = new Date(date);
  return Array.from({ length: Math.abs(n) }).reduce((currentDate) => {
    currentDate = addDaysToDate(currentDate, s);
    while (!isWeekday(currentDate))
      currentDate = addDaysToDate(currentDate, s);
    return currentDate;
  }, d);
addWeekDays('2020-10-05', 5);
// 2020-10-12
addWeekDays('2020-10-05', -5);
// 2020-09-28

[!WARNING]

上述代码片段可能不适用于实际场景,因为它没有考虑官方假期。如果您计划在生产中使用它,建议调整工作日检查,以包括已知假期的列表。