美文网首页
js的日期函数Date

js的日期函数Date

作者: 扶得一人醉如苏沐晨 | 来源:发表于2023-10-21 11:35 被阅读0次

    一、Date()函数讲解

    Date()是一个专门用来创建时间对象的,是一个复杂数据类型,具有读写属性

    语法: var time = new Date()

    new Date() 返回值是一个对象
    格式固定,并且时间是当前自己电脑的时间(只能获取当前本地的时间)

    image.png
    // 1.创建当前时间对象
    var time = new Date(); //Tue Oct 17 2023 20:01:22 GMT+0800 (中国标准时间)
    // 2.创建指定日期的时间对象,至少传递两个参数,分别是:年,月,日,时,分,秒,毫秒 需要注意的是这里的月是从0开始的
    // 如果输入的数字超出范围会自定进位
    var time = new Date(2023, 1, 1, 12, 30, 30, 999); //Wed Feb 01 2023 12:30:30 GMT+0800 (中国标准时间)
    // 3.通过传递字符串创建,下面的月份是从1开始的
    var time = new Date("2023-12-12 12:12:12"); //Tue Dec 12 2023 12:12:12 GMT+0800 (中国标准时间)
    var time = new Date("2023/12/12 12:12:12"); //Tue Dec 12 2023 12:12:12 GMT+0800 (中国标准时间)
    var time = new Date("2023/12/12"); //Tue Dec 12 2023 00:00:00 GMT+0800 (中国标准时间)
    // 4.通过时间戳创建
    var time = new Date(1666666666666); //Tue Oct 25 2022 10:57:46 GMT+0800 (中国标准时间)
    

    二、时间对象(new Date()构造的实例)的方法

    1.getFullYear()
        语法:时间对象.getFullYear()
        返回值:获取当前年份信息  number数据类型
    2.getMonth()
        语法:时间对象.getMonth()
        返回值:获取当前月份信息,0-11 number数据类型
    3.getDate()
        语法:时间对象.getDate()
        返回值:获取当前日信息 1-31 number数据类型
    4.getHours()
        语法:时间对象.getHours()
        返回值:获取当前小时信息,0-23 number数据类型
    5.getMinutes()
        语法:时间对象.getMinutes()
        返回值:获取当前分钟信息 0-59  number数据类型
    6.getSeconds()
        语法:时间对象.getSeconds()
        返回值:获取当前秒钟信息,0-59 number数据类型
    7.getMilliseconds()
        语法:时间对象.getMilliseconds()
        返回值:获取当前毫秒信息 0-999 number数据类型
        //前面多了个UTC获取到的是标准时间,中国时区会多8小时
    8.getUTCFullYear()
        语法:时间对象.getUTCFullYear()
        返回值:获取UTC模式下的年份信息  number数据类型
    9.getUTCMonth()
        语法:时间对象.getUTCMonth()
        返回值:获取UTC模式下的月份信息,0-11 number数据类型
    10.getUTCDate()
        语法:时间对象.getUTCDate()
        返回值:获取UTC模式下的日信息 1-31 number数据类型
    11.getUTCHours()
        语法:时间对象.getUTCHours()
        返回值:获取UTC模式下的小时信息,0-23 number数据类型
    12.getUTCMinutes()
        语法:时间对象.getUTCMinutes()
        返回值:获取UTC模式下的分钟信息 0-59  number数据类型
    13.getUTCSeconds()
        语法:时间对象.getUTCSeconds()
        返回值:获取UTC模式下的秒钟信息,0-59 number数据类型
    14.getUTCMilliseconds()
        语法:时间对象.getUTCMilliseconds()
        返回值:获取UTC模式下的毫秒信息 0-999 number数据类型
    15.getDay()
        语法:时间对象.getDay()
        返回值:该时间对象的周信息,0-6 number数据类型
    16.getTime()
        语法:时间对象.getTime()
        返回值:该时间对象的时间戳, number数据类型
        //时间对象到时间元年过了多少毫秒
    

    三、设置时间对象的方法

    1.setFullYear()
        语法:时间对象.setFullYear(要设置的年)
        作用:修改该对象的年份信息
    2.setMonth()
        语法:时间对象.setMonth(要设置的)
        作用:修改该对象的月份信息,0-11 
    3.setDate()
        语法:时间对象.setDate(要设置的)
        作用:修改该对象的日信息 1-31 number数据类型
    4.setHours()
        语法:时间对象.setHours(要设置的)
        作用:修改该对象的小时信息,0-23 number数据类型
    5.setMinutes()
        语法:时间对象.setMinutes(要设置的)
        作用:修改该对象的分钟信息 0-59  number数据类型
    6.setSeconds()
        语法:时间对象.setSeconds(要设置的)
        作用:修改该对象的秒钟信息,0-59 number数据类型
    7.setMilliseconds()
        语法:时间对象.setMilliseconds(要设置的)
        作用:修改该对象的毫秒信息 0-999 number数据类型
    //还有一套一样的 前面多了个UTC设置标准时间,中国时区会多8小时
    //时间对象.setUTCxxxx()    
    8.setDay()
        语法:时间对象.setDay(要设置的)
        作用:修改该对象的周几信息,0-6 number数据类型
    9.setTime()
        语法:时间对象.setTime(时间戳)
        作用:直接定位到指定时间
        //时间对象到时间元年过了多少毫秒
    

    四、常用方法封装

    4.1、日期大小比较

    const time1 = "2022-03-05 12:05:01";
    const time2 = "2022-08-05 12:05:03";
    function compareTime(time1, time2) {
     return new Date(time1) > new Date(time2);
    }
    compareTime(time1, time2); //false
    

    4.2、获取当前日期

    function padZero(num) {
      return num > 9 ? num : `0${num}`;
    }
    
    function getCurrentTime(timeStr) {
      const date = new Date(timeStr);
      const year = date.getFullYear();
      const month = padZero(date.getMonth() + 1);
      const day = padZero(date.getDate());
      const hour = padZero(date.getHours());
      const min = padZero(date.getMinutes());
      const second = padZero(date.getSeconds());
      return `${year}-${month}-${day} ${hour}:${min}:${second}`;
    }
    getCurrentTime(); //'2023-10-17 20:20:10'
    

    4.3、根据传入时间格式化时间

    function padZero(num) {
      return num > 9 ? num : `0${num}`;
    }
    
    function formateTime(timeStr) {
      const date = new Date(timeStr);
      const year = date.getFullYear();
      const month = padZero(date.getMonth() + 1);
      const day = padZero(date.getDate());
      const hour = padZero(date.getHours());
      const min = padZero(date.getMinutes());
      const second = padZero(date.getSeconds());
      return `${year}-${month}-${day} ${hour}:${min}:${second}`;
    }
    formateTime('2023/10/17 20:20:10'); //'2023-10-17 20:20:10'
    

    4.4、获取今天日期往后推一天

    /* 补0工具 */
    function padZero(num) {
      return num > 9 ? num : `0${num}`;
    }
    
    function getNextDay() {
      const now = new Date(); //获取当前时间
      const year = now.getFullYear(); //获取
      const month = padZero(now.getMonth() + 1);
      now.setDate(now.getDate() + 1); //setDate方法给当前时间对象设置明天的日期
      let day = now.getDate(); //now.getDate()永远都是今天的日期加1
      return year + "-" + month + "-" + day;
    }
    

    4.4、前n天的日期,前n个月的日期

    4.4.1、安装moment.js插件

    npm install moment --save
    

    4.4.2、获取前n天的日期,前n个月的日期

    import moment from "moment";
    /**
     * 近N天 -moment.js
     */
    export function getRecentDay(n) {
      return moment(new Date()).subtract(n, "days").format("YYYY-MM-DD");
    }
    // 近N月 - Moment.js
    export function getRecentMonth(n) {
      return moment(new Date()).subtract(n, "months").format("YYYY-MM-DD");
    }
    

    相关文章

      网友评论

          本文标题:js的日期函数Date

          本文链接:https://www.haomeiwen.com/subject/etqfidtx.html