JavaScript日期代码块

我们在设计前端的时候会遇到“昨天”、“上周”、“上月”、“上季度”、“去年”等操作,会涉及JavaScript代码的设计,如果有一个固定的JavaScript日期代码块供我们调用就会事半功倍。


JavaScript日期代码块_第1张图片

我们先来了解一下JavaScript获取当前日期的知识:

var myDate = new Date();
myDate.getYear();        //获取当前年份(2位)
myDate.getFullYear();    //获取完整的年份(4位,1970-????)
myDate.getMonth();       //获取当前月份(0-11,0代表1月)
myDate.getDate();        //获取当前日(1-31)
myDate.getDay();         //获取当前星期X(0-6,0代表星期天)
myDate.getTime();        //获取当前时间(从1970.1.1开始的毫秒数)
myDate.getHours();       //获取当前小时数(0-23)
myDate.getMinutes();     //获取当前分钟数(0-59)
myDate.getSeconds();     //获取当前秒数(0-59)
myDate.getMilliseconds();    //获取当前毫秒数(0-999)
myDate.toLocaleDateString();     //获取当前日期
var mytime=myDate.toLocaleTimeString();     //获取当前时间
myDate.toLocaleString( );        //获取日期与时间

1、“日”的操作
定义一个getDate()方法,通过参数“0”、“-1”、“1”等来获取“今天”、“昨天”、“明天”等日期,换句话说只要知道某一天和当前日期相差的天数,就可以通过getDate(“相差天数”)来获取那天的日期。

function getDate(dates) {
    var dd = new Date();
    dd.setDate(dd.getDate() + dates);
    var y = dd.getFullYear();
    var m = dd.getMonth() + 1;
    var d = dd.getDate();
    return y + "/" + m + "/" + d;
}

2、“周”的操作
我们可以先获取当前日期和本周一相差的天数,然后通过定义过的getDate()方法来获取本周一的日期,再进一步获取“上周一”、“下周一”等日期。例如,我们定义一个getMonday()方法,由于JavaScript中周日是“0”表示,所以可以直接获取到与本周一相差6天,其他相差天数均是当前星期减1天。那么就可以得到,周一:getDate(-getMonday());上周一:getDate(-getMonday()-7);下周一:getDate(-getMonday()+7)

function getMonday() {
    var d = new Date();
    var year = d.getFullYear();
    var month = d.getMonth() + 1;
    var date = d.getDate();
    // 周
    var day = d.getDay();
    var monday = day != 0 ? day - 1 : 6; // 本周一与当前日期相差的天数
    return monday;
}

3、“月”的操作
关于“月”我们经常会想到月的第一天和最后一天,所以我们定义方法的时候设置一个type参数(s,e)去区分是第一天和最后一天,设置另外一个参数months(-1,0,1)来代表上月、本月、下月,如下getMonth(type, months)。其中注意两个特殊情形,一个是当前月份是12月和1月时下月和上月的表示,另一个闰年对2月天数的影响。

function getMonth(type, months) {
    var d = new Date();
    var year = d.getFullYear();
    var month = d.getMonth() + 1;
    if (months != 0) {
        // 如果本月为12月,年份加1,月份为1,否则月份加1。
        if (month == 12 && months > 0) {
            year++;
            month = 1;
        } else if (month == 1 && months < 0) {
            year--;
            month = 12;
        } else {
            month = month + months;
        }
    }
    var date = d.getDate();
    var firstday = year + "/" + month + "/" + 1;
    var lastday = "";
    if (month == 1 || month == 3 || month == 5 || month == 7 || month == 8 || month == 10 || month == 12) {
        lastday = year + "/" + month + "/" + 31;
    } else if (month == 2) {
        // 判断是否为闰年(能被4整除且不能被100整除 或 能被100整除且能被400整除)
        if ((year % 4 == 0 && year != 0) || (year %4 == 0 && year % 100 == 0)) {
            lastday = year + "/" + month + "/" + 29;
        } else {
            lastday = year + "/" + month + "/" + 28;
        }
    } else {
        lastday = year + "/" + month + "/" + 30;
    }
    var day = "";
    if (type == "s") {
        day = firstday;
    } else {
        day = lastday;
    }
    return day;
}

4、“季度”的操作
类似于“月”的操作我们用type(s,e)和months(-3,0,3)两个参数来表示一个季度的第一天、最后一天和上季度、本季度、下季度。先定义一个方法getQFMonth(month)获取当前月所在季度的第一个月,也就是当前季度的第一个月份,在定义一个getQF(type, months)方法去获取想要季度的第一天和最后一天日期。

function getQFMonth(month) {
    var quarterMonthStart = 0;
    var spring = 1; //春  
    var summer = 4; //夏  
    var fall = 7; //秋  
    var winter = 10; //冬  
    if (month < 3) { return spring; }
    if (month < 6) { return summer; }
    if (month < 9) { return fall; }
    return winter;
};

function getQF(type, months) {
    var d = new Date();
    var year = d.getFullYear();
    var month = d.getMonth() + 1;
    var qfmonth = getQFMonth(month);
    if (months != 0) {
        if (qfmonth == 10 && months > 0) {
            year++;
            qfmonth = 1;
        } else if (qfmonth == 1 && months < 0) {
            year--;
            qfmonth = 10;
        } else {
            qfmonth = qfmonth + months;
        }
    }
    var fd = year + "/" + qfmonth + "/" + 1;
    var ed = "";
    if (qfmonth == 1 || qfmonth == 10) {
        //一、四季度最后一个天均是31日,二、三季度最后一天均是30日
        ed = year + "/" + (qfmonth + 2) + "/" + 31;
    } else {
        ed = year + "/" + (qfmonth + 2) + "/" + 30;
    }
    var qf = "";
    if (type == "s") {
        qf = fd;
    } else {
        qf = ed;
    }
    return qf;
}

5、“年”的操作
“年”的操作比较简单,依然类似“月”的操作,采取type(s,e)和years(-1,0,1)分别代表年的第一天、最后一天和去年、今年、明年,如下getYears(type, years)

function getYears(type, years) {
    var d = new Date();
    var year = d.getFullYear();
    //一年的第一天和最后一天一定是1日和31日
    var fd = (year + years) + "/" + 1 + "/" + 1;
    var ed = (year + years) + "/" + 12 + "/" + 31;
    var yr = "";
    if (type == "s") {
        yr = fd;
    } else {
        yr = ed;
    }
    return yr;
}

日期格式化
为了美观,网页上的日期表示经常是“xxxx/xx/xx”格式,例如:2018/08/05,但是上述方法得到的日期在“月”“日”小于10时默认“月”“日”前面不加“0”,例如:2018/8/5。这里我们来定义一个zeroDate(ymd)方法来格式化日期,即当“月”“日”小于10时“月”“日”前面加“0”,参数“ymd”是上述方法得到的未格式化日期,使用者可以根据自己需要选择是否需要此格式化操作。

function zeroDate(ymd){
    var ymd = ymd.split("/");
    var y = ymd[0];
    var m = ymd[1];
    var d = ymd[2];
    if (m < 10){
        m = '0' + m
    };
    if (d < 10){
        d = '0' + d
    };
    ymd = y + "/" + m + "/" + d;
    return ymd;
}

此文章部分代码参考于网络。

如果你喜欢本文章,还请点个关注和喜欢,我会为大家不断地带来Python学习笔记。

你可能感兴趣的:(JavaScript日期代码块)