js实现倒数 —— ‘剩下多少天多少秒’

Posted 2020-09-18 lastnigtic

一、开始

　　这个星期二去面试时遇到一道这样的题目"请用js实现距离XX还剩……天……小时……秒"，当时只是觉得创建一个数据保存下每个月有多少天，再去获取天数相减就可以了。

　　当时只是为了解决这个问题，并没有细想，现在觉得这种方法过于繁琐，而且还有闰年的问题。

　　现在我重新写一下这个方法，用时间戳来解决这个问题。

二、时间戳

　　什么是时间戳呢？时间戳其实就是现在的时间距离格林威治时间1970年01月01日00时00分00秒(北京时间1970年01月01日08时00分00秒)起至现在的总秒豪数。

　　注意北京时间有八个小时的误差，所以我们直接new Date(2018-01-01)其实是2018年1月1日的八点，所以我们要指定时间。

三、实现

　　比如我们写一个方法计算我们距2018年还有多少天：

function dateCount(){
        // 获取现在的时间
        var date = new Date();
        // 2018的第一天
        var until = new Date(\'2018-01-01 00:00:00\');
        // 计算时会发生隐式转换，调用valueOf()方法，转化成时间戳的形式
        var days = (until - date)/1000/3600/24; 
        // 下面都是简单的数学计算 
        var day = Math.floor(days);
        var hours = (days - day)*24;
        var hour = Math.floor(hours);
        var minutes = (hours - hour)*60;
        var minute = Math.floor(minutes);
        var seconds = (minutes - minute)*60;
        var second = Math.floor(seconds);
        var back = \'距离2018年还剩下\'+day+\'天\'+hour+\'小时\'+minute+\'分钟\'+second+\'秒\';
        return back;
    }

　　然后再用setInterval()方法实现实时倒数

setInterval(function(){
        var text = dateCount();
        // show是一个节点
        show.innerText = text;
},1000)

　　这样就实现了倒数：