• 日常搜索
  • 百度一下
  • Google
  • 在线工具
  • 搜转载

如何在JavaScript中从日期中添加和减去时间

如何在JavaScript中从日期中添加和减去时间  第1张

在本文中,我们将讨论如何使用 javascriptDate对象进行日期操作。具体来说,我们将了解如何在 JavaScript 中为对象添加时间Date并从对象中减去时间。

通常,您需要在 javaScript 中处理日期和时间。幸运的是,JavaScript 提供了一个内置Date对象,它提供了许多用于日期和时间管理的实用方法。尽管这些方法对于检索日期和时间的不同元素非常有用,但Date对象不提供任何可用于操作日期本身的方法。在大多数情况下,您可以只使用这些方法来格式化输出的日期和时间。

事实上,如果你想对一个Date对象执行诸如添加时间或从日期减去时间之类的操作,在 vanilla JavaScript 中没有简单的方法。通常,您最终会实施适合您的自定义解决方案。或者,您可以使用像 moment.js 这样的日期和时间库。今天,我们将讨论在 JavaScript 中执行日期操作的两种方式。

如何使用 Vanilla JavaScript 将时间添加到 JavaScript 日期

在本节中,我们将讨论如何Date在 vanilla JavaScript 中为 JavaScript 对象添加时间。

在 JavaScript 中,该getTime()函数返回自 Unix 纪元时间以来的毫秒数。这只是一个计算机时间约定,它计算自 1970 年 1 月 1 日午夜 UTC 以来的秒数(JavaScript 中的毫秒数)。

让我们尝试了解如何使用该函数为JavaScriptgetTime()中的对象添加时间。Date在以下示例中,我们将向现有Date对象添加一小时。

var currentDateObj = new Date();
var numberOfMlSeconds = currentDateObj.getTime();
var addMlSeconds = 60 * 60 * 1000;
var newDateObj = new Date(numberOfMlSeconds + addMlSeconds);

结果 currentDateObj: Sat Jul 24 2021 00:19:27 GMT-0300 (Atlantic Daylight Time) newDateObj: Sat Jul 24 2021 01:19:27 GMT-0300 (Atlantic Daylight Time)

首先,我们currentDateObj用当前日期初始化变量,它是一个Date对象。接下来,我们使用该getTime()函数从currentDateObj对象中获取毫秒数。

接下来,我们计算了一个小时内的毫秒数。基本上,我们只需将一小时内的分钟数 (60) 乘以一分钟内的秒数 (60) 乘以一秒内的毫秒数 (1000) 即可得到一小时内的毫秒数。

您可能已经知道,您可以Date通过提供毫秒数作为第一个参数来初始化一个对象,这将初始化一个引用它的日期对象。因此,我们添加了numberOfMlSecondsaddMlSeconds来获得总毫秒数,并且我们已经使用它来初始化一个新的日期对象。最终结果是newDateObj对象,与对象相比,它应该显示提前一小时的日期currentDateObj

事实上,您可以继续创建一个可重用的函数,如下面的代码片段所示。

function addHoursToDate(objDate, intHours) {
    var numberOfMlSeconds = objDate.getTime();
    var addMlSeconds = (intHours * 60) * 60 * 1000;
    var newDateObj = new Date(numberOfMlSeconds + addMlSeconds);

    return newDateObj;
}

例如,您可以通过以下方式调用它来获取未来某一天的日期。

addHoursToDate(Date.now(), 24)

结果 Sat Jul 25 2021 00:14:01 GMT-0300 (Atlantic Daylight Time)

这就是您可以使用该getTime()函数向 JavaScript 中的 Date 对象添加时间的方式。您还可以使用上述函数向现有 Date 对象添加天数;您只需在调用上述函数之前将几天转换为几小时。

如何使用 Vanilla JavaScript 从 JavaScript 日期中减去时间

在本节中,我们将了解如何从 JavaScriptDate对象中减去时间。

正如我们在上一节中已经讨论过的,您可以使用该getTime()函数从Date对象中获取毫秒数。因此,从Date对象中减去时间的逻辑与加法操作非常相似,只是我们需要减去毫秒而不是相加。

让我们通过下面的例子来看看它是如何工作的。

function subtractTimeFromDate(objDate, intHours) {
    var numberOfMlSeconds = objDate.getTime();
    var addMlSeconds = (intHours * 60) * 60 * 1000;
    var newDateObj = new Date(numberOfMlSeconds - addMlSeconds);

    return newDateObj;
}

如您所见,它几乎与添加操作相同。唯一的区别是我们是减去addMlSecondsnumberOfMlSeconds不是加。

如何使用 Moment.js 库执行日期操作

在上一节中,我们讨论了如何使用 vanilla JavaScript 执行日期和时间操作。如果您不需要对 JavaScriptDate对象进行任何复杂的操作,则可以使用 vanilla JavaScript 实现。另一方面,如果您的项目需要您执行不同类型的日期和时间操作,最好使用第三方库,它可以让您更轻松。

日期和时间可能会非常复杂。例如,考虑使用上述方法将年份添加到日期。如果岁月总是相同的长度,那就很容易了。然而,在现实世界中,我们有闰年。同样,如果您想在日期中添加几个月,您必须知道每个月有多少天。 

在本节中,我们将了解如何使用Moment.js库,它提供了大量的实用方法来操作 JavaScriptDate对象。继续下载Moment.js 库,您就可以使用它了!

您可以在此 CodePen 中测试 Moment.js 库。

// display the current datetime
console.log(moment().format());

// add '1' hour to the current datetime
console.log(moment().add(1, 'h').format());

// add '30' minutes to the current datetime
console.log(moment().add(30, 'm').format());

// add '2' days to the current datetime
console.log(moment().add(2, 'd').format());

// add '1' week to the current datetime
console.log(moment().add(1, 'w').format());

// add '1' month to the current datetime
console.log(moment().add(1, 'M').format());

// subtract '1' hour from the current datetime
console.log(moment().subtract(1, 'h').format());

// subtract '30' minutes from the current datetime
console.log(moment().subtract(30, 'm').format());

// subtract '1' day from the current datetime
console.log(moment().subtract(1, 'd').format());

// subtract '1' week from the current datetime
console.log(moment().subtract(1, 'w').format());

// subtract '3' months from the current datetime
console.log(moment().subtract(3, 'M').format());

您只需要调用该moment()函数即可获取当前日期对象。一旦你得到它,你可以使用不同的解析方法来格式化和操作方法来操作当前的日期对象。

您可以使用下面的 CodePen 来试验不同的 Moment 实用方法以及添加或减去日期的方法。有关更多信息,我建议您访问官方文档

这就是您可以使用 Moment.js 库来格式化和操作日期的方式。

结论

今天,我们讨论了如何使用 JavaScript Date 对象执行日期操作。除了原生 JavaScript,我们还探索了 Moment.js 库,它提供了相当简单的方法来执行日期操作。


文章目录
  • 如何使用 Vanilla JavaScript 将时间添加到 JavaScript 日期
  • 如何使用 Vanilla JavaScript 从 JavaScript 日期中减去时间
  • 如何使用 Moment.js 库执行日期操作
  • 结论