日期对象与倒计时案例

Posted 2022-09-22

日期对象

4.1 Date概述

Date对象和Math对象不一样,他是一个构造函数,所以我们需要实例化后才能使用
Date实例用来处理日期和时间

4.2Date()方法的使用

1.获取当前时间必须实例化

2.Date()构造函数的参数

如果括号里面有时间,就返回参数里面的时间。例如日期格式字符串为’2019-5-1’ , 可以写成new Date("2019-5-1)或者new Date(‘2019/5/1’)

<script>
   //Date()日期对象  是一个构造函数  必须使用new  来调用创建我们的日期对象
    var arr = new Array();  //创建一个数组对象
        var obj = new Object(); //创建了一个对象实例
        //1.使用Date  如果没有参数  返回当前系统的当前时间
        var date = new Date();
        console.log(date);
        //2.参数常用的写法  数字型  2019,10,01  或者是字符串型2019-10-1 8:8:8
        var date1 = new Date(2019,10,1);
        console.log(date1);  //返回的是 11月 不是10月
        var date2 = new Date(2019-10-1 8:8:8);
        console.log(date2);
</script>

4.日期对象

4.3 日期格式化

• 获取日期指定的部分，所以我们要手动的得到这种格式。

<script>   
 var date = new Date();  
 console.log(date.getUTCFullYear()); //返回当前日期的年 2019    console.log(date.getMonth() +1);  
 console.log(date.getMonth() +1);   //月份 返回的月份小1个月 记得月份+1
    console.log(date.getDate());    //返回的是  几号
    console.log(date.getDay()); // 周一返回的是1 周六返回的是6 但是  周日返回的是0
    
    //我们写一个2021年7月16日 星期三
    var year = date.getUTCFullYear();
    var month = date.getMonth() + 1;
    var dates = date.getDate();
    var arr = [星期日,星期一,星期二,星期三,星期四,星期五,星期六];
    var day = date.getDay();
    console.log(今天是： + year + 年 + month + 月 + dates + 日  + arr[day]);
</script>

结果：

4.3-2实践格式化：

<script>
    //格式化日期 时分秒
    var date = new Date();
    console.log(date.getMonth());   //时
    console.log(date.getMinutes());  //分
    console.log(date.getSeconds()); //秒
    //要求封装一个函数返回当前的时分秒 格式 08:08:08
    function getTime()
        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(getTime());
    </script>

4.4获取日期的总的毫秒形式

• Date对象是基于1970年1月1日(世界标准时间)起的毫秒数
• 为什么计算机起始时间从1970年开始?
• 我们经常利用总的毫秒数来计算时间,因为它更精确

重点案例：倒计时效果

案例分析：

• 核心算法:输入的时间减去现在的时间就是剩余的时间,即倒计时, 但是不能拿着时分秒相减,比如05分减去25分,结果会是负数的。
• 用时间戳来做。用户输入时间总的毫秒数减去现在时间的总的毫秒数,得到的就是剩余时间的毫秒数。
• 把剩余时间总的毫秒数转换为天、时、分、秒(时间戳转换为时分秒)

转换公式如下:

d= parselnt(总秒数/ 60/60/24); //计算天数
h= parselnt(总秒数/ 60/60 %24); //计算小时
m= parseInt(总秒数/60%60); // 计算分数
s = parselnt(总秒数%60); //计算当前秒数

代码案例：

<script>
        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(2021-7-17 18:00:00));
        var date = new Date();
        console.log(date);
    </script>