js获取上周本周下周的日期(附Demo)

2024-04-09 15:28

本文主要是介绍js获取上周本周下周的日期(附Demo),希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

目录

  • 前言
  • 1. 基本知识
  • 2. Demo
  • 3. 彩蛋

前言

现在的时间点是:2024-04-08,对应的日期如下(上周、这周、下周)

在这里插入图片描述

1. 基本知识

讲述Demo之前,先补充一些基础知识

JavaScript 中的 Date 对象是用于处理日期和时间的对象。它可以获取当前日期和时间,以及可以对日期和时间进行操作

以下是一些基本的 Date 对象的方法和属性:

var now = new Date(); // 创建一个表示当前时间的 Date 对象
var time = now.getTime(); // 获取当前时间的毫秒数,从 1970 年 1 月 1 日开始计算
var year = now.getFullYear(); // 获取当前年份
var date = now.getDate(); // 获取当前日期
var hour = now.getHours(); // 获取当前小时
var second = now.getSeconds(); // 获取当前秒钟
var week = now.getDay(); // 获取当前星期(注意:返回的是 0 表示星期天,1 表示星期一,以此类推)

其余方法如下:

  • getMilliseconds(): 获取当前毫秒数
  • getUTCFullYear():获取 UTC 时间的年份
  • getUTCMonth():获取 UTC 时间的月份
  • getUTCDate():获取 UTC 时间的日期
  • getUTCHours():获取 UTC 时间的小时
  • getUTCMinutes(): 获取 UTC 时间的分钟
  • getUTCSeconds():获取 UTC 时间的秒钟

注意事项:

  • getMonth() 方法返回的月份是从 0 开始的,所以在实际使用时需要加 1
  • getDay() 返回的是星期几的数字表示,需要使用数组或 switch 语句进行转换

JavaScript 的 Date 对象还提供了一系列设置日期和时间的方法,以及进行日期和时间运算的方法,如 setFullYear()setMonth()setDate()setHours() 等,以及 getTimezoneOffset()toUTCString() 等方法用于处理时区和格式化日期等

2. Demo

  1. 使用 moment.js 库来处理日期操作。
  2. 使用 isoWeekday 获取当前日期是一周的第几天,以确定是在本周还是上周或下周。
  3. 使用 startOf('isoWeek')endOf('isoWeek') 来获取本周的起始日期和结束日期。

根据当前日期的位置,计算上周和下周的日期范围

const moment = require('moment');
// 或者 import moment from 'moment'calculateWeekPeriods() {const today = moment();const dayOfWeek = today.isoWeekday();// 计算本周的起始日期和结束日期const startDateThisWeek = today.clone().startOf('isoWeek');const endDateThisWeek = today.clone().endOf('isoWeek');// 计算上周和下周的起始日期和结束日期const startDateLastWeek = startDateThisWeek.clone().subtract(1, 'week');const endDateLastWeek = startDateLastWeek.clone().endOf('isoWeek');const startDateNextWeek = startDateThisWeek.clone().add(1, 'week');const endDateNextWeek = startDateNextWeek.clone().endOf('isoWeek');// 格式化日期范围const formatDateRange = (startDate, endDate) => {return `${startDate.format('YYYY-MM-DD')}~${endDate.format('YYYY-MM-DD')}`;};// 生成周期数组const weekPeriods = [{ label: '上周', dateRange: formatDateRange(startDateLastWeek, endDateLastWeek) },{ label: '这周', dateRange: formatDateRange(startDateThisWeek, endDateThisWeek) },{ label: '下周', dateRange: formatDateRange(startDateNextWeek, endDateNextWeek) }];this.weekPeriods = weekPeriods;
}

通过ES6 中的箭头函数、模板字符串等语法,更加完好的展示如下功能:

// 获取当前日期和时间,包括年、月、日、周几、时、分、秒
const getCurrentDateTime = () => {const now = new Date();const year = now.getFullYear();let month = now.getMonth() + 1;let date = now.getDate();const day = now.getDay();let hour = now.getHours();let minu = now.getMinutes();let sec = now.getSeconds();// 格式化月份、日期、小时、分钟、秒数,保证两位数month = month < 10 ? "0" + month : month;date = date < 10 ? "0" + date : date;hour = hour < 10 ? "0" + hour : hour;minu = minu < 10 ? "0" + minu : minu;sec = sec < 10 ? "0" + sec : sec;// 返回格式化后的字符串return `${year}-${month}-${date}${day} 时间: ${hour}:${minu}:${sec}`;
};// 获取当前日期
const getCurrentDate = () => {const startDate = new Date();const year = startDate.getFullYear();let month = startDate.getMonth() + 1;let day = startDate.getDate();// 格式化月份、日期,保证两位数month = month < 10 ? "0" + month : month;day = day < 10 ? "0" + day : day;// 返回格式化后的字符串return `${year}-${month}-${day}`;
};// 获取当前日期减去指定天数的日期
const getDateMinusDays = (days) => {const nowDate = new Date();nowDate.setDate(nowDate.getDate() - days);const year = nowDate.getFullYear();let month = nowDate.getMonth() + 1;let date = nowDate.getDate();// 格式化月份、日期,保证两位数month = month < 10 ? "0" + month : month;date = date < 10 ? "0" + date : date;// 返回格式化后的字符串return `${year}-${month}-${date}`;
};// 获取当前日期加上指定天数的日期
const getDatePlusDays = (days) => {const nowDate = new Date();nowDate.setDate(nowDate.getDate() + days);const year = nowDate.getFullYear();let month = nowDate.getMonth() + 1;let date = nowDate.getDate();// 格式化月份、日期,保证两位数month = month < 10 ? "0" + month : month;date = date < 10 ? "0" + date : date;// 返回格式化后的字符串return `${year}-${month}-${date}`;
};// 获取当前日期加减指定天数的日期与具体时间点(时间戳获取)
const getDatePlusMinusDaysWithTime = (days, isPlus = true) => {const timestamp = new Date().getTime() / 1000;const adjustedTimestamp = isPlus ? timestamp + (60 * 60 * 24 * days) : timestamp - (60 * 60 * 24 * days);const adjustedDate = new Date(adjustedTimestamp * 1000);const year = adjustedDate.getFullYear();let month = adjustedDate.getMonth() + 1;let date = adjustedDate.getDate();let hour = adjustedDate.getHours();let minu = adjustedDate.getMinutes();let sec = adjustedDate.getSeconds();// 格式化月份、日期、小时、分钟、秒数,保证两位数month = month < 10 ? "0" + month : month;date = date < 10 ? "0" + date : date;hour = hour < 10 ? "0" + hour : hour;minu = minu < 10 ? "0" + minu : minu;sec = sec < 10 ? "0" + sec : sec;// 返回格式化后的日期与时间点return `${year}-${month}-${date} ${hour}:${minu}:${sec}`;
};// 示例:获取当前日期和时间
const currentDateTime = getCurrentDateTime();
console.log("当前日期和时间:", currentDateTime);// 示例:获取当前日期
const currentDate = getCurrentDate();
console.log("当前日期:", currentDate);// 示例:获取当前日期减去7天的日期
const dateMinus7Days = getDateMinusDays(7);
console.log("当前日期减去7天的日期:", dateMinus7Days);// 示例:获取当前日期加上7天的日期
const datePlus7Days = getDatePlusDays(7);
console.log("当前日期加上7天的日期:", datePlus7Days);// 示例:获取当前日期加减7天的日期与具体时间点(时间戳获取)
const datePlusMinus7DaysWithTime = getDatePlusMinusDaysWithTime(7);
console.log("当前日期加7天的日期与具体时间点:", datePlusMinus7DaysWithTime);const dateMinusMinus7DaysWithTime = getDatePlusMinusDaysWithTime(7, false);
console.log("当前日期减7天的日期与具体时间点:", dateMinusMinus7DaysWithTime);

3. 彩蛋

此处给出Java后端的写法:

// 获取当前日期
LocalDate currentDate = LocalDate.now();// 获取本周的起始日期和结束日期
LocalDate startDateThisWeek = currentDate.with(DayOfWeek.MONDAY);
LocalDate endDateThisWeek = currentDate.with(DayOfWeek.SUNDAY);// 获取上周的起始日期和结束日期
LocalDate startDateLastWeek = startDateThisWeek.minusWeeks(1);
LocalDate endDateLastWeek = endDateThisWeek.minusWeeks(1);// 获取下周的起始日期和结束日期
LocalDate startDateNextWeek = startDateThisWeek.plusWeeks(1);
LocalDate endDateNextWeek = endDateThisWeek.plusWeeks(1);

对于Java的基本知识推荐阅读:java框架 零基础从入门到精通的学习路线 附开源项目面经等(超全)

这篇关于js获取上周本周下周的日期(附Demo)的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/888524

相关文章

前端原生js实现拖拽排课效果实例

《前端原生js实现拖拽排课效果实例》:本文主要介绍如何实现一个简单的课程表拖拽功能,通过HTML、CSS和JavaScript的配合,我们实现了课程项的拖拽、放置和显示功能,文中通过实例代码介绍的... 目录1. 效果展示2. 效果分析2.1 关键点2.2 实现方法3. 代码实现3.1 html部分3.2

如何利用Java获取当天的开始和结束时间

《如何利用Java获取当天的开始和结束时间》:本文主要介绍如何使用Java8的LocalDate和LocalDateTime类获取指定日期的开始和结束时间,展示了如何通过这些类进行日期和时间的处... 目录前言1. Java日期时间API概述2. 获取当天的开始和结束时间代码解析运行结果3. 总结前言在J

JS 实现复制到剪贴板的几种方式小结

《JS实现复制到剪贴板的几种方式小结》本文主要介绍了JS实现复制到剪贴板的几种方式小结,包括ClipboardAPI和document.execCommand这两种方法,具有一定的参考价值,感兴趣的... 目录一、Clipboard API相关属性方法二、document.execCommand优点:缺点:

java获取图片的大小、宽度、高度方式

《java获取图片的大小、宽度、高度方式》文章介绍了如何将File对象转换为MultipartFile对象的过程,并分享了个人经验,希望能为读者提供参考... 目China编程录Java获取图片的大小、宽度、高度File对象(该对象里面是图片)MultipartFile对象(该对象里面是图片)总结java获取图片

Java通过反射获取方法参数名的方式小结

《Java通过反射获取方法参数名的方式小结》这篇文章主要为大家详细介绍了Java如何通过反射获取方法参数名的方式,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 目录1、前言2、解决方式方式2.1: 添加编译参数配置 -parameters方式2.2: 使用Spring的内部工具类 -

Java如何获取视频文件的视频时长

《Java如何获取视频文件的视频时长》文章介绍了如何使用Java获取视频文件的视频时长,包括导入maven依赖和代码案例,同时,也讨论了在运行过程中遇到的SLF4J加载问题,并给出了解决方案... 目录Java获取视频文件的视频时长1、导入maven依赖2、代码案例3、SLF4J: Failed to lo

springboot日期格式化全局LocalDateTime详解

《springboot日期格式化全局LocalDateTime详解》文章主要分析了SpringBoot中ObjectMapper对象的序列化和反序列化过程,并具体探讨了日期格式化问题,通过分析Spri... 目录分析ObjectMapper与jsonSerializer结论自定义日期格式(全局)扩展利用配置

使用Java实现获取客户端IP地址

《使用Java实现获取客户端IP地址》这篇文章主要为大家详细介绍了如何使用Java实现获取客户端IP地址,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 首先是获取 IP,直接上代码import org.springframework.web.context.request.Requ

C++实现获取本机MAC地址与IP地址

《C++实现获取本机MAC地址与IP地址》这篇文章主要为大家详细介绍了C++实现获取本机MAC地址与IP地址的两种方式,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 实际工作中,项目上常常需要获取本机的IP地址和MAC地址,在此使用两种方案获取1.MFC中获取IP和MAC地址获取

C/C++通过IP获取局域网网卡MAC地址

《C/C++通过IP获取局域网网卡MAC地址》这篇文章主要为大家详细介绍了C++如何通过Win32API函数SendARP从IP地址获取局域网内网卡的MAC地址,感兴趣的小伙伴可以跟随小编一起学习一下... C/C++通过IP获取局域网网卡MAC地址通过win32 SendARP获取MAC地址代码#i