Vanilla JavaScript:从日期中添加或减去天数(以及更多)

2023-12-01 0 1,021

Vanilla JavaScript:从日期中添加或减去天数(以及更多)

在最近的教程中,我们学习了如何获取和设置任何 Date 对象的月、日、年和时间的值。获取和设置这些日期值的能力在许多情况下都会派上用场。例如,您可以将特殊事件的日期存储在变量中。您还可以使用这些方法来显示当前日期和时间或对一段时间进行加减操作。

在本教程中,我们的重点将是学习如何从指定日期添加或减去一段时间,例如年、月、日、小时和分钟。

如何向日期添加年、月和日

您可能还记得我们的其他教程中,JavaScript 具有 setFullYear() 和 getFullYear() 等方法,您可以使用它们来设置和获取特定日期的当前全年。您可以使用 setMonth() 和 getMonth() 等方法来设置和获取特定日期的当前月份。同样,您可以使用 setDate() 和 getDate() 方法来设置和获取月份中的日期。

让我们编写一个函数,为日期添加年份。它将接受您想要添加的日期和年数作为其参数并返回新日期。

function addYearsToDate(date, years) {
let new_date = new Date(date);
new_date.setFullYear(new_date.getFullYear() + years);

return new_date;
}

let today = new Date();
let five_years_later = addYearsToDate(today, 5);

// Outputs: Date Wed Jun 07 2023 19:04:56 GMT+0530 (India Standard Time)
console.log(today);

// Outputs: Date Wed Jun 07 2028 19:04:56 GMT+0530 (India Standard Time)
console.log(five_years_later);

这里需要注意的重要一点是使用 Date() 构造函数创建一个新的 Date 对象,该对象被分配给变量 new_date。只需将 new_date 的值设置为给定的 date 就会导致它们都指向同一个 Date 对象。

我们将使用相同的逻辑创建 addMonthsToDate() 函数,该函数接受日期和要添加的月数作为参数并返回新日期。

function addMonthsToDate(date, months) {
let new_date = new Date(date);
new_date.setMonth(new_date.getMonth() + months);

return new_date;
}

let today = new Date();
let five_months_later = addMonthsToDate(today, 5);
let fifty_months_later = addMonthsToDate(today, 50);

// Outputs: Date Wed Jun 07 2023 19:15:04 GMT+0530 (India Standard Time)
console.log(today);

// Outputs: Date Tue Nov 07 2023 19:15:04 GMT+0530 (India Standard Time)
console.log(five_months_later);

// Outputs: Date Sat Aug 07 2027 19:15:04 GMT+0530 (India Standard Time)
console.log(fifty_months_later);

正如我在其他教程中提到的,setMonth() 方法遇到的任何溢出都会导致给定日期添加适当的年数。这就是我们将日期加上 50 个月后所发生的情况。它使我们的约会日期增加了 4 年零 2 个月。

现在,让我们编写一个函数,将给定的天数添加到我们指定的日期并返回一个新日期:

function addDaysToDate(date, days) {
let new_date = new Date(date);
new_date.setDate(new_date.getDate() + days);

return new_date;
}

let today = new Date();
let five_days_later = addDaysToDate(today, 5);
let thousand_days_later = addDaysToDate(today, 1000);

// Outputs: Date Wed Jun 07 2023 19:29:12 GMT+0530 (India Standard Time)
console.log(today);

// Outputs: Date Wed Jun 07 2023 19:29:12 GMT+0530 (India Standard Time)
console.log(five_days_later);

// Outputs: Date Wed Jun 07 2023 19:29:12 GMT+0530 (India Standard Time)
console.log(thousand_days_later);

在我们的日期中添加任何时间段

我们定义了三个新函数,允许我们在 JavaScript 中向给定日期添加年、月或日。您可能想在日期中添加一些其他时间段或持续时间,例如小时、分钟或秒。为它们再编写三个函数是没有意义的。

以下函数可用于将任意时间段添加到指定日期:

function addPeriodToDate(date, {years = 0, months = 0, days = 0, hours = 0, minutes = 0, seconds = 0}) {
let new_date = new Date(date);

new_date.setFullYear(new_date.getFullYear() + years);
new_date.setMonth(new_date.getMonth() + months);
new_date.setDate(new_date.getDate() + days);
new_date.setHours(new_date.getHours() + hours);
new_date.setMinutes(new_date.getMinutes() + minutes);
new_date.setSeconds(new_date.getSeconds() + seconds);

return new_date;
}

let today = new Date();
// Outputs: Date Wed Jun 07 2023 20:18:24 GMT+0530 (India Standard Time)
console.log(today);

let period = {years: 1, months: 2, days: 3};
let new_date = addPeriodToDate(today, period);
// Outputs: Date Sat Aug 10 2024 20:18:24 GMT+0530 (India Standard Time)
console.log(new_date);

period = {years: 4, months: 22};
new_date = addPeriodToDate(today, period);
// Outputs: Date Sat Apr 07 2029 20:18:24 GMT+0530 (India Standard Time)
console.log(new_date);

period = {days: 4, seconds: 22};
new_date = addPeriodToDate(today, period);
// Outputs: Date Sun Jun 11 2023 20:18:46 GMT+0530 (India Standard Time)
console.log(new_date);

如您所见,上述函数会为您处理任何溢出问题。也无需为所有时间单位提供值,因为默认情况下它们设置为 0。这意味着我们可以简单地传递我们想要添加的天数和秒数,同时跳过所有其他值。

从我们的日期中减去任何时间段

我们不需要编写任何单独的函数来从日期中减去任意时间段。您可以使用上一节中的函数来减去年、月、日、小时、分钟或秒。您需要做的就是提供该期间的负值。以下是一些示例:

period = {years: -1, months: -2, days: -3};
new_date = addPeriodToDate(today, period);

// Outputs: Date Mon Apr 04 2022 20:18:24 GMT+0530 (India Standard Time)
console.log(new_date);

period = {years: -4, months: -22};
new_date = addPeriodToDate(today, period);

// Outputs: Date Mon Aug 07 2017 20:18:24 GMT+0530 (India Standard Time)
console.log(new_date);

period = {days: -4, seconds: -22};
new_date = addPeriodToDate(today, period);

// Outputs: Date Sat Jun 03 2023 20:18:02 GMT+0530 (India Standard Time)
console.log(new_date);

最终想法

在本教程中,我们学习了两种不同的方法来解决 JavaScript 中日期加减年、月、日等问题。如果您只想添加或减去年份,您可以考虑创建一个像 addYearsToDate() 这样的函数,专门简单地执行此操作。另一种方法是创建一个更通用的 addPeriodToDate() 函数,它可以处理不同的时间单位。

以上就是Vanilla JavaScript:从日期中添加或减去天数(以及更多)的详细内容,更多请关注悠久资源其它相关文章!

收藏 (0) 打赏

感谢您的支持,我会继续努力的!

打开微信/支付宝扫一扫,即可进行扫码打赏哦,分享从这里开始,精彩与您同在
点赞 (0)

悠久资源 Wordpress教程 Vanilla JavaScript:从日期中添加或减去天数(以及更多) https://www.u-9.cn/jiaocheng/wordpress-jiaocheng/15883.html

常见问题

相关文章

发表评论
暂无评论
官方客服团队

为您解决烦忧 - 24小时在线 专业服务