JS计算两个时间间隔

栏目: JavaScript · 发布时间: 5年前

内容简介:JavaScript计算两个时间相隔了 多少年多少月多少日。时分秒这里不作考虑。若需要和当前时间比较,这里提供当前时间的获取格式化方法。我这里是根据传入类型输出日期或者日期+时间,可以明显看出传入两个参数,格式如:2008-08-08

1 前言

1.1 业务场景

JavaScript计算两个时间相隔了 多少年多少月多少日。时分秒这里不作考虑。

2 实现原理

2.1 获取当前时间

若需要和当前时间比较,这里提供当前时间的获取格式化方法。我这里是根据传入类型输出日期或者日期+时间,可以明显看出 typeday 时,输出日期。

getNowDate(type){
    let now = new Date()
    let year = now.getFullYear()
    let month = now.getMonth() + 1
    let day = now.getDate()
    let hh = now.getHours()
    let mm = now.getMinutes()
    let ss = now.getSeconds()

    month = month < 10 ? '0'+ month : month
    day = day < 10 ? '0'+ day : day

    if(type == 'day'){
      return year +'-'+ month +'-'+ day
    } else {
      return year +'-'+ month +'-'+ day + ' '+ hh + ':' + mm + ':' + ss
    }
},

2.2比较时间

传入两个参数,格式如:2008-08-08

getDiffYmdBetweenDate(sDate1,sDate2){
    var fixDate = function(sDate){
        var aD = sDate.split('-');
        for(var i = 0; i < aD.length; i++){
            aD[i] = fixZero(parseInt(aD[i]));
        }
        return aD.join('-');
    };
      
    var fixZero = function(n){
        return n < 10 ? '0'+n : n;
    };
      
    var fixInt = function(a){
        for(var i = 0; i < a.length; i++){
            a[i] = parseInt(a[i]);
        }
        return a;
    };
      
    var getMonthDays = function(y,m){
        var aMonthDays = [0,31,28,31,30,31,30,31,31,30,31,30,31];
        if((y%400 == 0) || (y%4==0 && y%100!=0)){
            aMonthDays[2] = 29;
        }
        return aMonthDays[m];
    };
      
    var checkDate = function(sDate){
    };
    var y = 0;
    var m = 0;
    var d = 0;
    var sTmp;
    var aTmp;
    sDate1 = fixDate(sDate1);
    sDate2 = fixDate(sDate2);
    if(sDate1 > sDate2){
        return 'past'
    }
    var aDate1 = sDate1.split('-');
    aDate1 = fixInt(aDate1);
    var aDate2 = sDate2.split('-');
    aDate2 = fixInt(aDate2);
    //计算相差的年份
    /*aTmp = [aDate1[0]+1,fixZero(aDate1[1]),fixZero(aDate1[2])];
    while(aTmp.join('-') <= sDate2){
        y++;
        aTmp[0]++;
    }*/
    y = aDate2[0] - aDate1[0];
    if( sDate2.replace(aDate2[0],'') < sDate1.replace(aDate1[0],'')){
        y = y - 1;
    }
    //计算月份
    aTmp = [aDate1[0]+y,aDate1[1],fixZero(aDate1[2])];
    while(true){
        if(aTmp[1] == 12){
            aTmp[0]++;
            aTmp[1] = 1;
        }else{
            aTmp[1]++;
        }
        if(([aTmp[0],fixZero(aTmp[1]),aTmp[2]]).join('-') <= sDate2){
            m++;
        } else {
            break;
        }
    }
    //计算天数
    aTmp = [aDate1[0]+y,aDate1[1]+m,aDate1[2]];
    if(aTmp[1] > 12){
        aTmp[0]++;
        aTmp[1] -= 12;
    }
    while(true){
        if(aTmp[2] == getMonthDays(aTmp[0],aTmp[1])){
            aTmp[1]++;
            aTmp[2] = 1;
        } else {
            aTmp[2]++;
        }
        sTmp = ([aTmp[0],fixZero(aTmp[1]),fixZero(aTmp[2])]).join('-');
        if(sTmp <= sDate2){
            d++;
        } else {
            break;
        }
    }
    return {y:y,m:m,d:d}
},

返回的结果是一个对象,包含了 y m d 三个属性,可根据业务进行取用展示。

比较时间的时候,若 sDate1 为小的时间,这里直接返回 past

2.3 页面展示

这里根据业务不同可以作不同的展示。这里列出自己的Vue展示处理展示。

其中 this.dataForm.hasdata 为页面的v-model。这样的处理的效果是观看直观。

let now = this.getNowDate('day')
let diffDate = this.getDiffYmdBetweenDate(now,this.data)
let hasdata = ''

if(diffDate == 'past'){
    this.dataForm.hasdata = '已过期'
} else {
    if(diffDate.y > 0){
        hasdata += diffDate.y + '年' + diffDate.m + '月'
    } else if (diffDate.y == 0) {
        if(diffDate.m > 0){
            hasdata += diffDate.m + '月'
        }
    }
    this.dataForm.hasdata = hasdata + diffDate.d + '日'
}

2.4 页面效果

JS计算两个时间间隔

JS计算两个时间间隔

JS计算两个时间间隔

3 后记

感谢支持。若不足之处,欢迎大家指出,共勉。

如果觉得不错,记得点赞 ,谢谢大家:joy:

欢迎关注 我的: Github 掘金 简书

3.1 参考资料

3.2 时间处理js库

这里列举几个js库备查找使用,排序无意义。

  • moment
  • day
  • date-fns
  • miment

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

信息烟尘

信息烟尘

戴维·申克 / 黄锫坚 / 江西教育出版社 / 2002 / 14.50元

今天,我们被大量的信息淹没了:传真、电子邮件、各种新闻、消息和铺天盖地的广告,正如人们以前预示的那样:出现了一个令人鼓舞的信息时代,媒体专家兼网络评论员戴维·申克透过这些繁荣的表象,揭示了大量的无用的信息对我们造成的干扰,或者说,“信息烟尘”对我们个人的健康(包括精神上的和肉体上的)及对社会造成的极大危害。这《信息烟尘:在信息爆炸中求生存》宣告了“信息时代”神话的破灭。一起来看看 《信息烟尘》 这本书的介绍吧!

正则表达式在线测试
正则表达式在线测试

正则表达式在线测试

RGB CMYK 转换工具
RGB CMYK 转换工具

RGB CMYK 互转工具

HEX CMYK 转换工具
HEX CMYK 转换工具

HEX CMYK 互转工具