javascript类型系统——日期Date对象全面了解


Posted in Javascript onJuly 13, 2016

前面的话

Date对象是javascript语言中内置的数据类型,用于提供日期和时间的操作接口。Date对象是在早期java中的java.util.Date类基础上创建的,为此,Date类型使用自UTC1970年1月1日0点开始经过的毫秒数来保存日期,它可以表示的时间范围是1970年1月1日0点前后的各1亿天。本文将详细介绍Date对象的用法

静态方法在介绍Date对象的构造函数之前,先介绍静态方法。因为,Date对象的静态方法与其构造函数有着千丝万缕的联系。使用构造函数创建Date对象的过程,类似于披着外套的静态方法的使用过程

Date对象总共有三个静态方法,分别是Date.now()、Date.parse()、Date.UTC()。这些方法通过Date()构造函数本身调用,而不是通过Date实例对象

Date.now()

ECMAScript5新增了now()方法,该方法返回当前时间距离1970年1月1日0点UTC的毫秒数。该方法不支持传递参数

[注意]该方法返回的是Number数字类型

console.log(Date.now());//1468297046050
console.log(Date.now('2016,1,1'));//1468297046050
console.log(typeof Date.now());//'number'

在不支持Date.now()方法的浏览器中,可以用+操作符把Date对象转换成数字,也可以实现类似效果

console.log(new Date());//Tue Jul 12 2016 12:21:33 GMT+0800 (中国标准时间)
console.log(+new Date());//1468297293433
console.log(+new Date(2000,1,1));//949334400000

该方法常用于分析代码的工作

var start = Date.now();
doSomething();
var stop = Date.now();
result = stop - start;

Date.parse()

该方法用于解析一个日期字符串,参数是一个包含待解析的日期和时间的字符串,返回从1970年1月1日0点到给定日期的毫秒数

该方法会根据日期时间字符串格式规则来解析字符串的格式,除了标准格式外,以下格式也支持。如果字符串无法识别,将返回NaN

1、'月/日/年' 如6/13/2004

2、'月 日,年' 如January 12,2004或Jan 12,2004

3、'星期 月 日 年 时:分:秒 时区' Tue May 25 2004 00:00:00 GMT-0700

[注意]浏览器不支持不表示日期只表示时间的字符串格式

console.log(Date.parse('6/13/2004'));//1087056000000
console.log(Date.parse('January 12,2004'));//1073836800000
console.log(Date.parse('Tue May 25 2004 00:00:00 GMT-0700'));//1085468400000
console.log(Date.parse('2004-05-25T00:00:00'));//1085443200000
console.log(Date.parse('2016'));//1451606400000
console.log(Date.parse('T00:00:00'));//NaN
console.log(Date.parse());//NaN

 [注意]在ECMAScript5中,如果使用标准的日期时间字符串格式规则的字符串中,数学前有前置0,则会解析为UTC时间,时间没有前置0,则会解析为本地时间。其他情况一般都会解析为本地时间

console.log(Date.parse('7/12/2016'));//1468252800000
console.log(Date.parse('2016-7-12'));//1468252800000
console.log(Date.parse('2016-07-12'));//1468281600000

Date.UTC()

Date.UTC()同样返回给定日期的毫秒数,但其参数并不是一个字符串,而是分别代表年、月、日、时、分、秒、毫秒的数字参数

Date.UTC(year,month,day,hours,minutes,seconds,ms),year和month参数是固定的,其余参数可选,日期时间格式规则详见此

因为该函数有7个形参,所以其length值为7

console.log(Date.UTC.length);//7

[注意]该方法使用的是UTC时间,而不是本地时间

console.log(Date.UTC(1970));//NaN
console.log(Date.UTC(1970,0));//0
console.log(Date.UTC(1970,0,2));//86400000
console.log(Date.UTC(1970,0,1,1));//3600000
console.log(Date.UTC(1970,0,1,1,59));//714000
console.log(Date.UTC(1970,0,1,1,59,30));//717000

构造函数Date()构造函数有多达5种的使用方法

【0】Date()

数可以不带new操作符,像一个函数一样调用。它将忽略所有传入的参数,并返回当前日期和时间的一个字符串表示

Date();

[注意]由于Date()函数没有使用操作符,实际上它不能被称为构造函数

console.log(Date());//"Tue Jul 12 2016 13:38:41 GMT+0800 (中国标准时间)"
console.log(Date('2016/1/1'));//"Tue Jul 12 2016 13:38:41 GMT+0800 (中国标准时间)"
console.log(typeof Date());//'string'

【1】Date()函数使用new操作符,且不带参数时,将根据当前时间和日期创建一个Date对象

new Date();
console.log(new Date());//Tue Jul 12 2016 13:41:45 GMT+0800 (中国标准时间)
console.log(new Date);//Tue Jul 12 2016 13:41:45 GMT+0800 (中国标准时间)
console.log(typeof new Date());//'object'

【2】Date()函数可接受一个数字参数,该参数表示设定时间与1970年1月1日0点之间的毫秒数

new Date(milliseconds);
console.log(new Date(0));//Thu Jan 01 1970 08:00:00 GMT+0800 (中国标准时间)
console.log(new Date(86400000));//Fri Jan 02 1970 08:00:00 GMT+0800 (中国标准时间)
console.log(typeof new Date(0));//object

【3】Date()函数可接受一个字符串参数,参数形式类似于Date.parse()方法。但parse()方法返回的是一个数字,而Date()函数返回的是一个对象 

new Date(datestring);

console.log(new Date('6/13/2004'));//Sun Jun 13 2004 00:00:00 GMT+0800 (中国标准时间)
console.log(Date.parse('6/13/2004'));//1087056000000
console.log(typeof new Date(6/13/2004));//object
console.log(typeof Date.parse(6/13/2004));//number

关于标准的日期时间字符串中前置0的处理,也类似于Date.parse()方法,若有前置0,则相当于UTC时间,若没有,则相当于本地时间。其余情况一般都为本地时间

console.log(new Date('7/12/2016'));//Tue Jul 12 2016 00:00:00 GMT+0800 (中国标准时间)
console.log(new Date('2016-7-12'));//Tue Jul 12 2016 00:00:00 GMT+0800 (中国标准时间)
console.log(new Date('2016-07-12'));//Tue Jul 12 2016 08:00:00 GMT+0800 (中国标准时间)

【4】Date()函数可接受参数形式类似于Date.UTC()方法的参数,但Date.UTC()方法返回是一个毫秒数,且是UTC时间,而Date()函数返回是一个对象,且是本地时间

console.log(new Date(2016,7,12));//Fri Aug 12 2016 00:00:00 GMT+0800 (中国标准时间)
console.log(+new Date(2016,7,12));//1470931200000
console.log(typeof new Date(2016,7,12));//'object'
console.log(Date.UTC(2016,7,12));//1470960000000
console.log(typeof Date.UTC(2016,7,12));//'number'

[注意]使用参数类似于Date.parse()函数的方法时,如果日期对象超出范围,浏览器会自动将日期计算成范围内的值;使用参数类似于Date.UTC()函数的方法时,如果日期对象超出范围,浏览器会提示Invalid Date

console.log(new Date(2016,7,32));//Thu Sep 01 2016 00:00:00 GMT+0800 (中国标准时间)
console.log(new Date(2016,8,1));//Thu Sep 01 2016 00:00:00 GMT+0800 (中国标准时间)
console.log(new Date('2016-8-32'));//Invalid Date
console.log(new Date('2016-9-1'));//Thu Sep 01 2016 00:00:00 GMT+0800 (中国标准时间)

实例方法

Date对象没有可以直接读写的属性,所有对日期和时间的访问都需要通过方法。Date对象的大多数方法分为两种形式:一种是使用本地时间,一种是使用UTC时间,这些方法在下面一起列出。例如,get[UTC]Day()同时代表getDay()和getUTCDay()

Date对象一共有46个实例方法,可以分为以下3类:to类、get类、set类

【to类】

to类方法从Date对象返回一个字符串,表示指定的时间

toString()

返回本地时区的日期字符串

toUTCString()

返回UTC时间的日期字符串

toISOString()

返回Date对象的标准的日期时间字符串格式的字符串

toTimeString()

返回Date对象的时间部分的字符串

toJSON()

返回一个符合JSON格式的日期字符串,与toISOString方法的返回结果完全相同

console.log(new Date('2016-7-12').toString());//Tue Jul 12 2016 00:00:00 GMT+0800 (中国标准时间)
console.log(new Date('2016-7-12').toUTCString());//Mon, 11 Jul 2016 16:00:00 GMT
console.log(new Date('2016-7-12').toISOString());//2016-07-11T16:00:00.000Z
console.log(new Date('2016-7-12').toDateString());//Tue Jul 12 2016
console.log(new Date('2016-7-12').toTimeString());//00:00:00 GMT+0800 (中国标准时间)
console.log(new Date('2016-7-12').toJSON());//2016-07-11T16:00:00.000Z

toLocaleString()

toString()方法的本地化转换

toLocaleTimeString()

toTimeString()方法的本地化转换

toLocaleDateString()

toDateString()方法的本地化转换

console.log(new Date('2016-7-12').toString());//Tue Jul 12 2016 00:00:00 GMT+0800 (中国标准时间)
console.log(new Date('2016-7-12').toLocaleString());//2016/7/12 上午12:00:00
console.log(new Date('2016-7-12').toDateString());//Tue Jul 12 2016
console.log(new Date('2016-7-12').toLocaleDateString());//2016/7/12
console.log(new Date('2016-7-12').toTimeString());//00:00:00 GMT+0800 (中国标准时间)
console.log(new Date('2016-7-12').toLocaleTimeString());//上午12:00:00

【get类】

Date对象提供了一系列get类方法,用来获取实例对象某个方面的值

在介绍get类方法之前,首先要介绍valueOf()方法

valueOf()

返回距离1970年1月1日0点的毫秒数

因此,可以方便地使用比较运算符来比较日期值

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

getTime()

返回距离1970年1月1日0点的毫秒数,同valueOf()

在ECMAScript5之前,可以使用getTime()方法实现Date.now()

Date.now = function(){
    return (new Date()).getTime()
  }

getTimezoneOffset()

返回当前时间与UTC的时区差异,以分钟表示(8*60=480分钟),返回结果考虑到了夏令时因素

console.log(new Date('2016-7-12').valueOf());//1468252800000
console.log(new Date('2016-7-12').getTime());//1468252800000
console.log(new Date('2016-7-12').getTimezoneOffset());//-480

getYear()

返回距离1900年的年数(已过时)

get[UTC]FullYear()

返回年份(4位数)

get[UTC]Month()

返回月份(0-11)

get[UTC]Date()

返回第几天(1-31)

get[UTC]Day()

返回星期几(0-6)

get[UTC]Hours()

返回小时值(0-23)

get[UTC]Minutes()

返回分钟值(0-59)

get[UTC]Seconds()

返回秒值(0-59)

get[UTC]Milliseconds()

返回毫秒值(0-999)

[注意]通过标准日期时间格式字符串,且有前置0的形式的参数设置,设置的是UTC时间

console.log(new Date('2016-07-12T10:00').getYear());//116
console.log(new Date('2016-07-12T10:00').getFullYear());//2016
console.log(new Date('2016-07-12T10:00').getUTCFullYear());//2016
console.log(new Date('2016-07-12T10:00').getMonth());//6
console.log(new Date('2016-07-12T10:00').getUTCMonth());//6
console.log(new Date('2016-07-12T10:00').getDate());//12
console.log(new Date('2016-07-12T10:00').getUTCDate());//12
console.log(new Date('2016-07-12T10:00').getDay());//2
console.log(new Date('2016-07-12T10:00').getUTCDay());//2
console.log(new Date('2016-07-12T10:00').getHours());//18
console.log(new Date('2016-07-12T10:00').getUTCHours());//10
console.log(new Date('2016-07-12T10:00').getMinutes());//0
console.log(new Date('2016-07-12T10:00').getUTCMinutes());//0
console.log(new Date('2016-07-12T10:00').getSeconds());//0
console.log(new Date('2016-07-12T10:00').getUTCSeconds());//0
console.log(new Date('2016-07-12T10:00').getMilliseconds());//0
console.log(new Date('2016-07-12T10:00').getUTCMilliseconds());//0
//当前时间为16:35
console.log(new Date().getHours());//16
console.log(new Date().getUTCHours());//8

【set类】

Date对象提供了一系列set类方法,用来设置实例对象的各个方面

set方法基本与get方法相对应,set方法传入类似于Date.UTC()的参数,返回调整后的日期的内部毫秒数

[注意]星期只能获取,不能设置

setTime()

使用毫秒的格式,设置一个Date对象的值

var d = new Date('2016-07-12T10:00');
console.log(d.setTime(86400000),d);//86400000 Fri Jan 02 1970 08:00:00 GMT+0800 (中国标准时间)

setYear()

设置年份(已过时)

var d = new Date('2016-07-12T10:00');
console.log(d.setYear(2000),d,d.getYear());//963396000000 Wed Jul 12 2000 18:00:00 GMT+0800 (中国标准时间) 100

set[UTC]FullYear()

设置年份(4位数),以及可选的月份值和日期值

set[UTC]Month()

设置月份(0-11),以及可选的日期值

set[UTC]Date()

设置第几天(1-31)

var d = new Date('2016-07-12T10:00');
console.log(d.setFullYear(2015,1,1),d.getFullYear());//1422784800000 2015
console.log(d.setMonth(2),d.getMonth());//1425204000000 2
console.log(d.setDate(20),d.getDate());//1426845600000 20
console.log(d.toLocaleString());//2015/3/20 下午6:00:00

set[UTC]Hours()

设置小时值(0-23),以及可选的分钟值、秒值及毫秒值

set[UTC]Minutes()

设置分钟值(0-59),以及可选的秒值及毫秒值

set[UTC]Seconds()

设置秒值(0-59),以及可选的毫秒值

set[UTC]Milliseconds()

设置毫秒值(0-999)

var d = new Date('2016-07-12T10:20:30');
console.log(d.setHours(1,2,3),d.getHours());//1468256523000 1
console.log(d.setMinutes(2,3),d.getMinutes());//1468256523000 2
console.log(d.setSeconds(3),d.getSeconds());//1468256523000 3
console.log(d.toLocaleTimeString())//上午1:02:03
var d = new Date('2016-07-12T10:20:30');
console.log(d.setUTCHours(1,2,3),d.getHours());//1468285323000 9
console.log(d.setUTCMinutes(2,3),d.getMinutes());//1468285323000 2
console.log(d.setUTCSeconds(3),d.getSeconds());//1468285323000 3
console.log(d.toLocaleTimeString())//上午9:02:03

以上这篇javascript类型系统——日期Date对象全面了解就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
使用Jquery Aajx访问WCF服务(GET、POST、PUT、DELETE)
Mar 16 Javascript
JavaScript中的函数声明和函数表达式区别浅析
Mar 27 Javascript
JS实现向表格行添加新单元格的方法
Mar 30 Javascript
bootstrap 表单验证使用方法
Jan 11 Javascript
Vue实现选择城市功能
May 27 Javascript
初学者AngularJS的环境搭建过程
Oct 27 Javascript
jQuery中each方法的使用详解
Mar 18 jQuery
React如何解决fetch跨域请求时session失效问题
Nov 02 Javascript
JavaScript实现的九种排序算法
Mar 04 Javascript
js取0-9随机取4个数不重复的数字代码实例
Mar 27 Javascript
使用 Vue-TCB 快速在 Vue 应用中接入云开发的方法
Feb 10 Javascript
Element Popover 弹出框的使用示例
Jul 26 Javascript
浅谈javascript中关于日期和时间的基础知识
Jul 13 #Javascript
jQuery EasyUI菜单与按钮详解
Jul 13 #Javascript
JQuery对ASP.NET MVC数据进行更新删除
Jul 13 #Javascript
Javascript表单特效之十大常用原理性样例代码大总结
Jul 12 #Javascript
Bootstrap登陆注册页面开发教程
Jul 12 #Javascript
深入浅析knockout源码分析之订阅
Jul 12 #Javascript
Bootstrap组件系列之福利篇几款好用的组件(推荐二)
Jul 12 #Javascript
You might like
PHP 函数执行效率的小比较
2010/10/17 PHP
php中in_array函数用法探究
2014/11/25 PHP
修改Laravel5.3中的路由文件与路径
2016/08/10 PHP
JavaScript 原型链学习总结
2010/10/29 Javascript
Javascript学习笔记-详解in运算符
2011/09/13 Javascript
JavaScript判断一个字符串是否包含指定子字符串的方法
2015/03/18 Javascript
javascript跨域的方法汇总
2015/10/23 Javascript
基于jquery实现图片上传本地预览功能
2016/01/08 Javascript
JS DOM实现鼠标滑动图片效果
2020/09/17 Javascript
js实现鼠标左右移动,图片也跟着移动效果
2017/01/25 Javascript
vue params、query传参使用详解
2017/09/12 Javascript
快速搭建React的环境步骤详解
2017/11/06 Javascript
Vue中的Vux配置指南
2017/12/08 Javascript
puppeteer实现html截图的示例代码
2019/01/10 Javascript
微信小程序开发之左右分栏效果的实例代码
2019/05/20 Javascript
解决使用layui的时候form表单中的select等不能渲染的问题
2019/09/18 Javascript
Egg Vue SSR 服务端渲染数据请求与asyncData
2019/11/24 Javascript
Python IDLE清空窗口的实例
2018/06/25 Python
python对视频画框标记后保存的方法
2018/12/07 Python
在pycharm 中添加运行参数的操作方法
2019/01/19 Python
通过python爬虫赚钱的方法
2019/01/29 Python
使用Python实现毫秒级抢单功能
2019/06/06 Python
Python 批量刷博客园访问量脚本过程解析
2019/08/30 Python
python如何基于redis实现ip代理池
2020/01/17 Python
番木瓜健康和保健产品第一大制造商:Herbal Papaya
2017/04/25 全球购物
英国历史最悠久的DJ设备供应商:DJ Finance、DJ Warehouse、The DJ Shop
2019/09/04 全球购物
.NET remoting的两种通道是什么
2016/05/31 面试题
J2EE模式面试题
2016/10/11 面试题
大学生自我鉴定
2013/12/16 职场文书
节约电力资源的建议书
2014/03/12 职场文书
移风易俗倡议书
2014/04/15 职场文书
四查四看自我剖析材料
2014/09/19 职场文书
2015年信访维稳工作总结
2015/04/07 职场文书
重温入党誓词主持词
2015/06/29 职场文书
Appium中scroll和drag_and_drop根据元素位置滑动
2022/02/15 Python
Spring Data JPA框架Repository自定义实现
2022/04/28 Java/Android