zoukankan      html  css  js  c++  java
  • 0152 日期对象Date:实例化,属性和方法,操作总毫秒数【时间戳】,案例

    Date 对象和 Math 对象不一样,Date是一个构造函数,所以使用时需要实例化后才能使用其中具体方法和属性。Date 实例用来处理日期和时间

    1.4.1 使用Date实例化日期对象

    • 获取当前时间必须实例化
    • 注意:如果创建实例时并未传入参数,则得到的日期对象是当前时间对应的日期对象
    var now = new Date();
    console.log(now);  // Mon Jan 06 2020 16:39:38 GMT+0800 (中国标准时间)
    
    • 获取指定时间的日期对象
    var future = new Date('2019/5/1');
    

    注意:如果创建实例时并未传入参数,则得到的日期对象是当前时间对应的日期对象

            // Date() 日期对象  是一个构造函数 必须使用new 来调用创建我们的日期对象
            // var arr = new Array(); // 创建一个数组对象
            // var obj = new Object(); // 创建了一个对象实例
    
            // 1. 使用Date  如果没有参数 返回当前系统的当前时间
            var date = new Date();
            console.log(date);  // Mon Jan 06 2020 13:57:35 GMT+0800 (中国标准时间)
    
            // 2. 参数常用的写法:(1)数字型: 2019, 10, 01;(2)字符串型:'2019-10-1 8:8:8'
            var date1 = new Date(2019, 10, 1);
            console.log(date1); // 返回的是11月,不是10月,Fri Nov 01 2019 00:00:00 GMT+0800 (中国标准时间)
    
            var date2 = new Date('2019-10-1 8:8:8');
            console.log(date2);  // Tue Oct 01 2019 08:08:08 GMT+0800 (中国标准时间)
    


    1.4.2 使用Date实例的方法和属性

            // 格式化日期 年月日 
            var date = new Date();
            console.log(date.getFullYear()); // 返回当前日期的年  2019
            console.log(date.getMonth() + 1); // 月份 返回的月份小1个月   记得月份+1 呦
            console.log(date.getDate()); // 返回的是 几号
            console.log(date.getDay()); // 3  周一返回的是 1 周六返回的是 6 但是 周日返回的是 0
            // 我们写一个 2019年 5月 1日 星期三
            var year = date.getFullYear();
            var month = date.getMonth() + 1;
            var dates = date.getDate();
            var arr = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
            var day = date.getDay();
            console.log('今天是:' + year + '年' + month + '月' + dates + '日 ' + arr[day]);
    
            // 补充的代码
            var date = new Date();
            var year = date.getFullYear(),
                month = date.getMonth() + 1,
                jihao = date.getDate(),
                day = date.getDay(),
                week = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
    
            console.log(`今天是:${year}年${month}月${jihao}日 ${week[day]}`); // 今天是:2020年1月6日 星期一
    
            // 格式化日期: 时分秒
            var date = new Date();
            console.log(date.getHours()); // 时
            console.log(date.getMinutes()); // 分
            console.log(date.getSeconds()); // 秒
            // 要求封装一个函数返回当前的时分秒 格式 08:08:08
            function getTimer() {
                var time = new Date();
                var h = time.getHours();
                h = h < 10 ? '0' + h : h;
                var m = time.getMinutes();
                m = m < 10 ? '0' + m : m;
                var s = time.getSeconds();
                s = s < 10 ? '0' + s : s;
                return h + ':' + m + ':' + s;
            }
            console.log(getTimer());
    
    
            // 补充的代码
            function getTime() {
                var date = new Date(),
                    h = date.getHours() > 10 ? date.getHours() : '0' + date.getHours(),
                    m = date.getMinutes() > 10 ? date.getMinutes() : '0' + date.getMinutes(),
                    s = date.getSeconds() > 10 ? date.getSeconds() : '0' + date.getSeconds();
    
                // console.log(h, m, s);
                console.log(`现在是:${h}时${m}分${s}秒`);
            }
            getTime()
    

    1.4.3 通过Date实例获取总毫秒数【时间戳】

    • 总毫秒数的含义

      ​ 基于1970年1月1日(世界标准时间)起的毫秒数【时间戳】

    • 获取总毫秒数

      // 实例化Date对象
      var now = new Date();
      // 1. 用于获取对象的原始值
      console.log(date.valueOf())	
      console.log(date.getTime())	
      // 2. 简单写可以这么做
      var now = + new Date();			
      // 3. HTML5中提供的方法,有兼容性问题
      var now = Date.now();
      
            // 倒计时效果
            // 1.核心算法:输入的时间减去现在的时间就是剩余的时间,即倒计时 ,但是不能拿着时分秒相减,比如 05 分减去25分,结果会是负数的。
            // 2.用时间戳来做。用户输入时间总的毫秒数减去现在时间的总的毫秒数,得到的就是剩余时间的毫秒数。
            // 3.把剩余时间总的毫秒数转换为天、时、分、秒 (时间戳转换为时分秒)
            // 转换公式如下: 
            //  d = parseInt(总秒数/ 60/60 /24);    //  计算天数
            //  h = parseInt(总秒数/ 60/60 %24)   //   计算小时
            //  m = parseInt(总秒数 /60 %60 );     //   计算分数
            //  s = parseInt(总秒数%60);            //   计算当前秒数
            function countDown(time) {
                var nowTime = +new Date(); // 返回的是当前时间总的毫秒数
                var inputTime = +new Date(time); // 返回的是用户输入时间总的毫秒数
                var times = (inputTime - nowTime) / 1000; // times是剩余时间总的秒数 
                var d = parseInt(times / 60 / 60 / 24); // 天
                d = d < 10 ? '0' + d : d;
                var h = parseInt(times / 60 / 60 % 24); //时
                h = h < 10 ? '0' + h : h;
                var m = parseInt(times / 60 % 60); // 分
                m = m < 10 ? '0' + m : m;
                var s = parseInt(times % 60); // 当前的秒
                s = s < 10 ? '0' + s : s;
                return d + '天' + h + '时' + m + '分' + s + '秒';
            }
            console.log(countDown('2019-5-1 18:00:00'));
            var date = new Date();
            console.log(date);
    
    
            // 我的优化:把补0的操作,封装成一个函数
            function addZero(t) {
                return t = t > 10 ? t : '0' + t;
            }
    
            function countDown(time) {
                var nowTime = +new Date();
                var endTime = +new Date(time);
                var times = (endTime - nowTime) / 1000;
                var d = parseInt(times / 60 / 60 / 24); //  计算天数
                d = addZero(d);
                var h = parseInt(times / 60 / 60 % 24) //   计算小时
                h = addZero(h);
                var m = parseInt(times / 60 % 60); //   计算分数
                m = addZero(m);
                var s = parseInt(times % 60); //   计算当前秒数
                s = addZero(s);
    
                return `${d}天 ${h}小时 ${m}分钟 ${s}秒`;
            }
    
            console.log(countDown('2020-01-06 17:00:00'));
    
            var d2 = new Date();
            console.log(d2);
    
  • 相关阅读:
    day12. 闭包
    day11.函数的全局变量和局部变量
    day10.函数基础及函数参数
    day9.关于文件的操作
    day7.关于字符串的相关操作
    day8.列表、字典、集合相关操作
    day6. while双项循环及for循环
    LeetCode-Unique Binary Search Trees II
    LeetCode-Unique Binary Search Trees
    LeetCode-Edit Distance
  • 原文地址:https://www.cnblogs.com/jianjie/p/12157253.html
Copyright © 2011-2022 走看看