JS基本篇--日期Date详解与实例扩大

2024年4月5日 267次阅读来源: 风雨后见彩虹

一：Date范例引见

要建立一个日期对象，运用new操作符和Date组织函数即可：

var now = new Date();

Date.parse()要领

个中Date.parse()要领吸收一个示意日期的字符串参数，然后尝试依据这个字符串返回响应日期的毫秒数。ECMA-262没有定义Date.parse()应当支撑哪一种日期花样，因而这个要领的行动因完成而异，而且一般是因区域而异。将区域设置为美国的浏览器一般都接收以下日期花样：

“月/日/年”，如6/13/2004;
“英文月名日,年”，如May 12,2004;
“英文礼拜几英文月名日年时:分:秒时区”，如Tue May 25 2004 00:00:00 GMT+0800。
ISO 8601扩大花样YYYY-MM-DDTHH:mm:ss:sssZ（比方
2004-05-25T00::00:00）。只要兼容ECMAScript5的完成支撑这类花样。

比方，要为2004年5月25日建立一个日期对象，可以运用下面的代码：

//Tue May 25 2004 00:00:00 GMT+0800 (中国标准时候)
var someDate = new Date(Date.parse('May 25,2004'));

假如传入Data.parse()的要领的字符串不能示意日期花样，会返回NAN。实际上，假如直接将示意日期的字符串通报给Date组织函数，也会在背景挪用Date.parse()要领，比方下面的代码跟前面的是等价的。

//Tue May 25 2004 00:00:00 GMT+0800 (中国标准时候)
var someDate = new Date('May 25,2004');

这行代码将会获得与前面一行雷同的日期对象。

Date.UTC()要领
Date.UTC()一样返回日期的毫秒数。但它与Date.parse()在构建值时运用的是差别的信息。Date.UTC()的参数离别示意年份、基于0的月数（一月是0，二月是1，顺次类推）、月中的哪一天（1到31）、小时数（0到23）、分钟、秒、毫秒数。在这些参数中只要前两个参数是必需的（年和月）。假如没有供应月中的天数，则假定天数为1；假如省略别的参数，则一切假定为0，以下例子：

//GMT时候2000年1月1日半夜零时
var y2k = new Date(Date.UTC(2000,0));
console.log(y2k); //Sat Jan 01 2000 08:00:00 GMT+0800 (中国标准时候)

//GMT时候2005年5月5日下昼5:55:55
var allFives = new Date(Date.UTC(2005,4,5,17,55,55));
console.log(allFives);//Fri May 06 2005 01:55:55 GMT+0800 (中国标准时候)

申明下：Greenwich Mean Time (GMT)格林尼治标准时候英国、爱尔兰、冰岛和葡萄牙属于该时区。这个时区与中国北京时候的时差是8个小时，也就是说比北京时候晚8个小时。

Date组织函数
Date组织函数会模拟Date.UTC(),但有一点差别的是，日期和时候都是基于当地时区而非GMT来建立。不过他们的参数跟Date.UTC()的参数一样。

比方：

//当地时候2000年1月1日半夜零时
var y2k = new Date(2000,0);
console.log(y2k); //Sat Jan 01 2000 00:00:00 GMT+0800 (中国标准时候)

//当地时候2005年5月5日下昼5:55:55
var allFives = new Date(2005,4,5,17,55,55);
console.log(allFives);//Thu May 05 2005 17:55:55 GMT+0800 (中国标准时候)

给Date组织函数通报参数常运用以下几种体式格局：（注：参数可以为整数; 也可以为字符串; 但花样必需准确）

new Date(2009,1,1); //准确
new Date(“2009/1/1”); //准确
new Date(“2009-1-1”); //不兼容，在谷歌下能剖析，在IE浏览器9及以上结果为[date] Invalid
Date，IE8及以下结果为NAN。

申明：日期对象new Date()的参数情势以下：

1）new Date(“month dd,yyyy hh:mm:ss”);
2）new Date(“month dd,yyyy”);
3）new Date(yyyy,mth,dd,hh,mm,ss);
4）new Date(yyyy,mth,dd);
5）new Date(ms);

须要注重末了一种情势，参数示意的是须要建立的时候和 GMT时候1970年1月1日之间相差的毫秒数。种种函数的寄义以下：

month:用英文示意月份称号，从January到December
mth:用整数示意月份，从0（１月）到１１（１２月）
dd:示意一个月中的第几天，从1到31
yyyy:四位数示意的年份
hh:小时数，从0（半夜）到23（晚11点）
mm: 分钟数，从0到59的整数
ss:秒数，从0到59的整数
ms:毫秒数，为大于即是0的整数

比方：

new Date("January 12,2006 22:19:35"); 
new Date("January 12,2006"); 
new Date(2006,0,12,22,19,35); 
new Date(2006,0,12); 
new Date(1137075575000);

上面的种种建立情势都示意2006年1月12日这一天。

Date.now()要领
ES5增加了Date.now()要领，返回示意这个要领时的日期和时候的毫秒数。这个要领简化了运用Date对象剖析代码的事情，比方：

//获得最先时候
var start = Date.now();

//挪用函数
dosomething();

//获得完毕时候
var stop = Date.now(),
    result = stop - start;
console.log(start,stop,result); //1494292306763 1494292306768 5

function dosomething(){
    console.log('打印结果');
}

支撑Date.now()要领的浏览器包含IE9+，FireFox3+，Safari3+，Opera10.5+和Chrome。在不支撑的别的浏览器，运用+操作符把Date对象转成字符串，也可以到达雷同的目标。

//获得最先时候
var start = +new Date();

//挪用函数
dosomething();

//获得完毕时候
var stop = +new Date(),
    result = stop - start;
console.log(start,stop,result); //1494292306763 1494292306768 5

function dosomething(){
    console.log('打印结果');
}

那末就出来这么一个例子，JavaScript 猎取当前毫秒时候戳有以下几种要领：

console.log(Date.parse(new Date()));    //结果：1494301186000//不引荐; 毫秒改成了000显现
console.log((new Date()).valueOf());    //结果：1494301186175       
console.log(new Date().getTime());      //结果：1494301186175    
console.log(Date.now());                //结果：1494301186175
console.log(+new Date());               //结果：1494301186175

继续的要领

与别的援用范例一样，Date范例也重写了toLocaleString()、toString()和valueOf()要领。

个中toLocaleString()、toString()在显现日期和时候没有什么代价；而valueOf()要领不是返回的字符串，而是返回日期的毫秒示意。因而可以方便运用比较操作符（大于或小于）来比较日期值。以下面的例子：

var date1 = new Date(2007,0,1);
var date2 = new Date(2007,1,1);
console.log(date1 < date2); //true
console.log(date1 > date2); //false

日期花样化要领

Date范例另有一些特地用于将日期花样化为字符串的要领，以下：

toDateString()——以特定于完成的花样显现礼拜几、月、日和年；

toTimeString()——以特定于完成的花样显现时、分、秒和时区；

toLocaleDateString()——以特定与区域的花样显现礼拜几、月、日和年；

toLocaleTimeString()——以特定于完成的花样显现时、分、秒；

toUTCString()——以特定于完成的花样完全的UTC日期。

与toLocaleString()和toString()要领一样，以上这些字符串花样的要领输出也是因浏览器而异的。因而没有哪个要领可以用来在用户界面上显现一致的日期信息。

日期/时候组件要领

以下赤色标记为经常使用：

Date() 返回当日的日期和时候。
getDate() 从 Date 对象返回一个月中的某一天 (1 ~ 31)。
getDay() 从 Date 对象返回一周中的某一天 (0 ~ 6)。
getMonth() 从 Date 对象返回月份 (0 ~ 11)。
getFullYear() 从 Date 对象以四位数字返回年份。
getYear() 请运用 getFullYear() 要领替代。
getHours() 返回 Date 对象的小时 (0 ~ 23)。
getMinutes() 返回 Date 对象的分钟 (0 ~ 59)。
getSeconds() 返回 Date 对象的秒数 (0 ~ 59)。
getMilliseconds() 返回 Date 对象的毫秒(0 ~ 999)。
getTime() 返回 1970 年 1 月 1 日至今的毫秒数。
getTimezoneOffset() 返回当地时候与格林威治标准时候 (GMT) 的分钟差。
getUTCDate() 依据世界时从 Date 对象返回月中的一天 (1 ~ 31)。
getUTCDay() 依据世界时从 Date 对象返回周中的一天 (0 ~ 6)。
getUTCMonth() 依据世界时从 Date 对象返回月份 (0 ~ 11)。
getUTCFullYear() 依据世界时从 Date 对象返回四位数的年份。
getUTCHours() 依据世界时返回 Date 对象的小时 (0 ~ 23)。
getUTCMinutes() 依据世界时返回 Date 对象的分钟 (0 ~ 59)。
getUTCSeconds() 依据世界时返回 Date 对象的秒钟 (0 ~ 59)。
getUTCMilliseconds() 依据世界时返回 Date 对象的毫秒(0 ~ 999)。
setDate() 设置 Date 对象中月的某一天 (1 ~ 31)。
setMonth() 设置 Date 对象中月份 (0 ~ 11)。
setFullYear() 设置 Date 对象中的年份（四位数字）。
setYear() 请运用 setFullYear() 要领替代。
setHours() 设置 Date 对象中的小时 (0 ~ 23)。
setMinutes() 设置 Date 对象中的分钟 (0 ~ 59)。
setSeconds() 设置 Date 对象中的秒钟 (0 ~ 59)。
setMilliseconds() 设置 Date 对象中的毫秒 (0 ~ 999)。
setTime() 以毫秒设置 Date 对象。
setUTCDate() 依据世界时设置 Date 对象中月份的一天 (1 ~ 31)。
setUTCMonth() 依据世界时设置 Date 对象中的月份 (0 ~ 11)。
setUTCFullYear() 依据世界时设置 Date 对象中的年份（四位数字）。
setUTCHours() 依据世界时设置 Date 对象中的小时 (0 ~ 23)。
setUTCMinutes() 依据世界时设置 Date 对象中的分钟 (0 ~ 59)。
setUTCSeconds() 依据世界时设置 Date 对象中的秒钟 (0 ~ 59)。
setUTCMilliseconds() 依据世界时设置 Date 对象中的毫秒 (0 ~ 999)。

挪用体式格局：

var myDate = new Date();
myDate.getYear(); //猎取当前年份(2位)
myDate.getFullYear(); //猎取完全的年份(4位,1970-????)
myDate.getMonth(); //猎取当前月份(0-11,0代表1月)         // 所以猎取当前月份是myDate.getMonth()+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)

简朴经常使用示例

1.猎取当前时候

function getNowTime() {
    return new Date();
}

2.时候与天数相加

function getTimeAddDays(time, days) {
    return new Date(time.getTime() + days * 24 * 60 * 60 * 1000);
}

3.猎取并花样化日期：年-月-日

function getFormatDate(time) {
   return time.getFullYear() + "-" + (time.getMonth() + 1) + "-" + time.getDate();
}

4.字符串转换为日期，字符串花样：2011-11-20

function convertToDate(strings) {
    return new Date(Date.parse(strings.replace(/-/g, "/")));
}

或许：

function convertToDate(strings) {
    return new Date(strings.replace(/-/g, "/"));
}

5.猎取并花样化礼拜

// 盘算体系当前是礼拜几
var str = "今天是礼拜" + "日一二三四五六".charat(new Date().getDay());

可检察《JS进阶篇–JS盘算体系当前日期是礼拜几的几种要领》

6.时候比较

function compareTime(time1, time2) {
    return time1.getTime() - time2.getTime();
}

7.盘算两个日期之间相隔的天数

function getDays(time1, tiem2){
    var day = 24*60*60*1000;
    return (time1.getTime() - time2.getTime())/day;
}

扩大示例

1.JS推断某年某月有若干天

JavaScript内里的new Date("xxxx/xx/xx")这个日期的组织要领有一个妙处，当你传入的是”xxxx/xx/0″（0号）的话，获得的日期是”xx”月的前一个月的末了一天（”xx”月的最大取值是69，题外话），假如传入"1999/13/0"，会获得"1998/12/31"。而且最大的优点是当你传入”xxxx/3/0″，会获得xxxx年2月的末了一天，它会自动推断昔时是不是是闰年来返回28或29，不必本身推断，太方便了！！所以，我们想获得选择年挑选月有若干天的话，只须要

var d=new Date(“挑选年/挑选月+1/0”);
alert(d.getDate());

下面是运用Javascript编写的猎取某年某月有若干天的getDaysInOneMonth(year, month)要领：

  function getDaysInOneMonth(year, month){  
     month = parseInt(month,10)+1;  
     var d= new Date(year+"/"+month+"/0");  
     return d.getDate();  
  }

Chrome浏览器（谷歌浏览器）对这个特征不支撑，获得的结果是NAN。兼容性问题啊！其缘由就是非标准日期花样。

改成以下的花样就OK：

function getDaysInMonth(year,month){
  var month = parseInt(month,10);
  var temp = new Date(year,month,0);
  return temp.getDate();
}
console.log(getDaysInMonth(2017,2)); //28

2.js猎取某年某月的哪些天是周六和周日

<div id="text"></div>
<script type="text/javascript">
    function time(y,m){
    var tempTime = new Date(y,m,0);
    var time = new Date();
    var saturday = new Array();
    var sunday = new Array();
    for(var i=1;i<=tempTime.getDate();i++){
        var ss = time.setFullYear(y,m-1,i);
        var day = time.getDay();
        if(day == 6){
            saturday.push(i);
        }else if(day == 0){
            sunday.push(i);
        }
    }
    var text = y+"年"+m+"月份"+"<br />"
                +"周六："+saturday.toString()+"<br />"
                +"周日："+sunday.toString();
    document.getElementById("text").innerHTML = text;
}
 
time(2017,2);
</script>

3.运用JavaScript天生一个倒数7天的数组

形貌：

比方今天是10月1号，天生的数组是[“9月25号”,”9月26号”,”9月27号”,”9月28号”,”9月29号”,”9月30号”,”10月1号”]。
这个难点就是须要推断这个月份(能够还须要上一个月份)是30天照样31天，而且另有瑞年的2月28天或许29天。

要领一：
不须要那末庞杂，在js中异常简朴，由于js的date对象是可以介入数学运算的！！！看下面的代码：

var now = new Date('2012/3/2 12:00:00'); 
var s = '';
var i = 0;
while (i < 7) {
    s += now.getFullYear() + '/' + (now.getMonth() + 1) + '/' + now.getDate() + '\n';
    
    // 这个是症结！！！减去一天的毫秒数结果就是把日期往前推一天
    now = new Date(now - 24 * 60 * 60 * 1000);
    i++;
}
console.log(s);

结果：

2017/6/2
2017/6/1
2017/5/31
2017/5/30
2017/5/29
2017/5/28
2017/5/27

要领二：
依据当前体系时候，来盘算这个倒数7天的数组：

var now = new Date(); 
var s = '';
var i = 0;
while (i < 7) {
    s += now.getFullYear() + '/' + (now.getMonth() + 1) + '/' + now.getDate() + '\n';
    
    // 这个是症结！！！减去一天的毫秒数结果就是把日期往前推一天
    now = new Date(now - 24 * 60 * 60 * 1000); 
    i++;
}
console.log(s);

结果：

2017/6/2
2017/6/1
2017/5/31
2017/5/30
2017/5/29
2017/5/28
2017/5/27

要领三：
用Date 的 setDate()要领

var today = new Date();
var curday = today.getFullYear() +"/" + Number(today.getMonth() + 1) +"/"+ today.getDate(); //2017/11/9
var dates = [curday];
for (var i = 1; i < 7; i++) {
    var d = new Date(today);
    d.setDate(d.getDate() - i);
       var ss = d.getFullYear() +"/" + Number(d.getMonth() + 1) +"/"+ d.getDate();
    dates.unshift(ss);
}
console.log(dates);

结果：
["2017/11/3", "2017/11/4", "2017/11/5", "2017/11/6", "2017/11/7", "2017/11/8", "2017/11/9"]

注：setDate() 要领用于设置一个月的某一天。
getDate() 要领可返回月份的某一天。
unshift() 要领可向数组的开首增加一个或更多元素，并返回新的长度。

4.js猎取上一个月、下一个月花样为yyyy-mm-dd的日期

function GetMonthFun(){}

//date的日期花样为 yyyyy-mm-dd
GetMonthFun.prototype.getPrevMonth = function(date){
    var arr = date.split('-');
    var year = arr[0]; //猎取当前日期的年份
    var month = arr[1]; //猎取当前日期的月份
    var day = arr[2]; //猎取当前日期的日
    var days = new Date(year, month, 0);
    days = days.getDate(); //猎取当前日期中月的天数
    var year2 = year;
    var month2 = parseInt(month) - 1;
    if (month2 == 0) {
        year2 = parseInt(year2) - 1;
        month2 = 12;
    }
    var day2 = day;
    var days2 = new Date(year2, month2, 0);
    days2 = days2.getDate();
    if (day2 > days2) {
        day2 = days2;
    }
    if (month2 < 10) {
        month2 = '0' + month2;
    }
    var t2 = year2 + '-' + month2 + '-' + day2;
    return t2;
}

//date的日期花样为 yyyyy-mm-dd
GetMonthFun.prototype.getNextMonth = function(date){
    var arr = date.split('-');
    var year = arr[0]; //猎取当前日期的年份
    var month = arr[1]; //猎取当前日期的月份
    var day = arr[2]; //猎取当前日期的日
    var days = new Date(year, month, 0);
    days = days.getDate(); //猎取当前日期中的月的天数
    var year2 = year;
    var month2 = parseInt(month) + 1;
    if (month2 == 13) {
        year2 = parseInt(year2) + 1;
        month2 = 1;
    }
    var day2 = day;
    var days2 = new Date(year2, month2, 0);
    days2 = days2.getDate();
    if (day2 > days2) {
        day2 = days2;
    }
    if (month2 < 10) {
        month2 = '0' + month2;
    }

    var t2 = year2 + '-' + month2 + '-' + day2;
    return t2;
}

var dateObj = new GetMonthFun();
console.log(dateObj.getPrevMonth('2014-01-25')); //2013-12-25
console.log(dateObj.getNextMonth('2014-10-31')); //2014-11-30

    原文作者：风雨后见彩虹
    原文地址: https://segmentfault.com/a/1190000000426861
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。