JavaScript—Date对象详情

Date对象概述

javaScript 提供了 Date 类型来处理时间和日期。Date 对象内置一系列获取和设置日期时间信息的方法。(不是内置对象,需要自己new)

javaScript 中的 Date 类型是在早期 Java 中 java.util.Date 类基础上构建的。

Date类型使用 UTC (Coordinated Universal Time,国际协调时间[又称世界统时间]) 1970 年 1 月1 日午夜(零时)开始经过的毫秒来保存日期。

在使用这种数据存储格式的条件下,Date 类型保存的日期能够精确到 1970 年 1 月 1 日之前或之后的 285616 年。

创建Date对象

创建一个日期对象,使用 new 运算符和 Date 构造方法(构造函数)即可。

//创建一个日期对象而不传递参数的情况下,返回系统当前时间   时间格式:Thu Mar 27 2014 20:18:08 GMT+0800  不同浏览器显示不同
var box = new Date();
console.log(box); // 2019-04-13T13:39:33.968Z

//new可以省略
var time = Date();
console.log(time); // Sat Apr 13 2019 21:39:33 GMT+0800 (GMT+08:00)

//创建一个指定的时间对象
//需要在构造函数中传递一个表示时间的字符串作为参数
//日期的格式  月份/日/年 时:分:秒
var d2 = new Date("2/18/2011 11:10:30");
console.log(d2) //2011-02-18T03:10:30.000Z

Date对象的两个重要的静态方法

Date.parse()方法

接收一个表示日期的字符串参数,然后尝试根据这个字符串返回相应的毫秒数。

没有定义Date.parse()应该支持哪种日期格式,因此方法的行为因实现而异,因地区而异。默认通常接收的日期格式如下:

'//',如 6/13/2011;
'英文月名 日, ',如 May 25, 2004;
'英文星期几 英文月名 日 年 时::秒 时区',如 Tue May 25 2004 00:00:00 GMT-070

console.log(Date.parse('6/13/2011')); //1307894400000

//如果 Date.parse()没有传入或者不是标准的日期格式,那么就会返回 NaN
console.log(Date.parse()); //NaN
console.log(Date.parse("fjkasfjkasfak")); //NaN

// 如果想输出指定的日期,那么把 Date.parse()传入 Date 构造方法里
var box1 = new Date(Date.parse('6/13/2011'));//Mon Jun 13 2011 00:00:00 GMT+0800,将毫秒数转换成看的懂得时间格式
var box2 = new Date('6/13/2011'); //直接传入,Date.parse()后台被调用

console.log(box1) // 2011-06-12T16:00:00.000Z
console.log(box2) // 2011-06-12T16:00:00.000Z

Date.UTC()方法

返回表示日期的毫秒数,但它与 Date.parse()在构建值时使用不同的信息。

年份,基于 0 的月份[0 表示 1 月,1 表示 2 ],月中的哪一天[1-31],小时数[0-23],分钟,秒以及毫秒。

只有前两个参数是必须的。如果没有提供月数,则天数为 1;如果省略其他参数,则统统为 0

console.log(Date.UTC(2011,11,2)); //1322697600000
console.log(Date.UTC(2011,11,2, 12, 33, 43, 32)); //1322829223032

// 如果 Date.UTC()参数传递错误,那么就会出现负值或者 NaN 等非法信息。
console.log(Date.UTC()); //负值或者 NaN

var box = new Date(Date.UTC(2011,11, 5, 15, 13, 16));
console.log(box) // 2011-12-05T15:13:16.000Z

Date对象的内置方法

通用方法

与其他类型一样,Date 类型也重写了 toLocaleString()toString()valueOf()方法;但这些方法返回值与其他类型中的方法不同。

var box = new Date(Date.UTC(2011,11, 5, 15, 13, 16));
console.log(box); // 2011-12-05T15:13:16.000Z
console.log('toString:' + box.toString()); // toString:Mon Dec 05 2011 23:13:16 GMT+0800 (GMT+08:00)
console.log('toLocaleString:' + box.toLocaleString()); //按本地格式输出:toLocaleString:2011-12-5 23:13:16
console.log('valueOf:' + box.valueOf()); //返回毫秒:valueOf:1323097996000

日期格式化方法

Date 类型还有一些专门用于将日期格式化为字符串的方法

var box = new Date();
console.log(box); // 2019-04-13T14:04:50.805Z
console.log(box.toDateString()); //以特定的格式显示星期几、月、日和年:Sat Apr 13 2019
console.log(box.toTimeString()); //以特定的格式显示时、分、秒和时区// 22:04:50 GMT+0800 (GMT+08:00)
console.log(box.toLocaleDateString()); //以特定地区格式显示年、月和日:2019-4-13
console.log(box.toLocaleTimeString()); //以特定地区格式显示上午还是下午和时、分、秒:22:04:50
console.log(box.toUTCString()); //以特定的格式显示完整的 UTC 日期:Sat, 13 Apr 2019 14:04:50 GMT

组件方法

单独获取你想要的各种时间/日期而提供的方法。

需要注意的是,这些方法中,有带 UTC 的,有不带 UTC 的。UTC 日期指的是在没有时区偏差的情况下的日期值。

var box = new Date();
console.log(box.getTime()); //获取日期的毫秒数,和 valueOf()返回一致:1555167669220
console.log(box.setTime(100)); //以毫秒数设置日期,会改变整个日期:100

console.log(box.getFullYear()); //获取四位年份:1970
console.log(box.setFullYear(2012)); //设置四位年份,返回的是毫秒数:1325376000100

console.log(box.getMonth()); //获取月份,没指定月份,从 0 开始算起:0
console.log(box.setMonth(11)); //设置月份,返回毫秒数:1354320000100

console.log(box.getDate()); //获取日期:1
console.log(box.setDate(8)); //设置日期,返回毫秒数:1354924800100

console.log(box.getDay()); //返回星期几,0 表示星期日,6 表示星期六:6
//console.log(box.setDay(2)); //设置星期几

console.log(box.getHours()); //返回时
console.log(box.setHours(12)); //设置时

console.log(box.getMinutes()); //返回分钟
console.log(box.setMinutes(22)); //设置分钟

console.log(box.getSeconds()); //返回秒数
console.log(box.setSeconds(44)); //设置秒数

console.log(box.getMilliseconds()); //返回毫秒数
console.log(box.setMilliseconds()); //设置毫秒数

console.log(box.getTimezoneOffset()); //返回本地时间和 UTC 时间相差的分钟数

将日期时间对象格式化成符合阅读习惯的格式

获取当前日期时间对象,将年月日时分秒,分别获取出来,拼接成字符串的样式

var date = new Date();
var year = date.getFullYear();
var month = date.getMonth()+1;
var day = date.getDate();
if(month<10)
  month="0"+month;
if(day<10)
  day = "0"+day
var hours = date.getHours()
var minutes = date.getMinutes();
var second = date.getSeconds();

//拼接成2014年3月26日 20:23:23
var dateTime = year+"年"+month+"月"+day+"日"+" "+hours+":"+minutes+":"+second;
console.log(dateTime); //2019年04月13日 23:18:50

将日期时间对象格式化成符合阅读习惯的格式扩展

<script type="text/javascript">
    function getDateDemo(){
        var date = new Date();
        var year = date.getFullYear();
        var month = date.getMonth()+1;
        var day = date.getDate();
        if(month<10)
            month="0"+month;
        if(day<10)
            day = "0"+day;
    
        var hours = date.getHours();
        if(hours<10)
            hours = "0"+hours;
    
        var minutes = date.getMinutes();
        if(minutes<10)
            minutes = "0"+minutes;
    
        var second = date.getSeconds();
        if(second<10)
            second = "0"+second;
        var mSecond = date.getMilliseconds();
    
        //拼接成2014年3月26日 20:23:23
        var dateTime = year+"年"+month+"月"+day+"日"+" "+hours+"时"+minutes+"分"+second+"秒"+mSecond;
        // document.write(dateTime);
    
        //通过DOM获取节点方法,找到div节点标签document.getElementById();
        var divNode = document.getElementById("time");
        //使用div的属性:innerHTML
        divNode.innerHTML = dateTime;
    }
    window.setInterval("getDateDemo()",100);
</script>
<style type="text/css">
    div{242px;float:left;}</style>
</head>
<body>
    <div id="time"> </div><span>毫秒</span>
</body>

对象日期的计算:计算两个时间相隔多少天:2013-2-3—2014-3-4

将字符串转换成日期对象(毫秒值)使用的是Date对象的parse()方法,将两个毫秒值相减等到的毫秒值/1000/60/60/24

parse()方法传入的时间格式是月//年等合法的格式

将两个毫秒值相减得到的结果可能是负数,但是时间是没有负数的,所以应该得到的结果毫秒值进行绝对值的转换后在/1000/60/60/24

function DateDemo(){
  var day1 = '2/3/2013';
  var day2 = '2/6/2015';

  var time1 = Date.parse(day1);//返回时间的毫秒值
  var time2 = Date.parse(day2);
  console.log(time1) // 1359820800000
  console.log(time2) // 1423152000000
  console.log((Math.abs(time2-time1))/1000/60/60/24);
}
DateDemo();
原文地址:https://www.cnblogs.com/LO-ME/p/10687056.html