前言

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

静态方法

总共有3个静态方法:Date.now()、Date.parse()、Date.UTC()

【Date.now()】

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

  1. Date.now() // 1554790104142
  2. +new Date() // 会把时间隐式转换成时间戳 1554790169778
  3. new Date().getTime() // 1554790104942

【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

  1. Date.parse('4/9/2019') // 1554739200000
  2. Date.parse('May 12,2019') // 1557590400000
  3. Date.parse('Tue May 12 2019 00:00:00 GMT-0700') // 1557644400000
  4. Date.parse('T00:00:00') // NaN
  5. Date.parse() // NaN

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

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

【Date.UTC()】

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

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

构造函数

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

【1】Date()函数可以不带new操作符,像一个函数一样调用。它将忽略所有传入的参数,并返回当前日期和时间的一个字符串表示
[注意]由于Date()函数没有使用操作符,实际上它不能被称为构造函数

  1. console.log(Date());//Tue Apr 09 2019 15:57:50 GMT+0800 (中国标准时间)
  2. console.log(Date('2016/1/1'));//Tue Apr 09 2019 15:57:50 GMT+0800 (中国标准时间)
  3. console.log(typeof Date());//'string'

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

  1. console.log(new Date());//Tue Apr 09 2019 15:59:13 GMT+0800 (中国标准时间)
  2. console.log(new Date);//Tue Apr 09 2019 15:59:13 GMT+0800 (中国标准时间)
  3. console.log(typeof new Date());//'object'

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

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

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

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

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

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

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

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

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

  1. console.log(new Date(2016,7,32));//Thu Sep 01 2016 00:00:00 GMT+0800 (中国标准时间)
  2. console.log(new Date(2016,8,1));//Thu Sep 01 2016 00:00:00 GMT+0800 (中国标准时间)
  3. console.log(new Date('2016-8-32'));//Invalid Date
  4. 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对象的标准的日期时间字符串格式的字符串

toDateString() 返回Date对象的日期部分的字符串

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

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

toLocaleString() toString()方法的本地化转换

toLocaleTimeString() toTimeString()方法的本地化转换

toLocaleDateString() toDateString()方法的本地化转换

  1. console.log(new Date('2016-7-12').toString());//Tue Jul 12 2016 00:00:00 GMT+0800 (中国标准时间)
  2. console.log(new Date('2016-7-12').toUTCString());//Mon, 11 Jul 2016 16:00:00 GMT
  3. console.log(new Date('2016-7-12').toISOString());//2016-07-11T16:00:00.000Z
  4. console.log(new Date('2016-7-12').toDateString());//Tue Jul 12 2016
  5. console.log(new Date('2016-7-12').toTimeString());//00:00:00 GMT+0800 (中国标准时间)
  6. console.log(new Date('2016-7-12').toJSON());//2016-07-11T16:00:00.000Z
  7. console.log(new Date('2016-7-12').toLocaleString());//2016/7/12 上午12:00:00
  8. console.log(new Date('2016-7-12').toLocaleDateString());//2016/7/12
  9. console.log(new Date('2016-7-12').toLocaleTimeString());//上午12:00:00

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

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

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

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

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

  1. new Date('2016-7-12').valueOf() //1468252800000
  2. new Date('2016-7-12').getTime() //1468252800000
  3. new Date('2016-7-12').getTimezoneOffset() // -480

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时间

  1. const d = new Date('2019-04-12 12:30:30');
  2. d.getFullYear() // 2019
  3. d.getUTCFullYear() // 2019
  4. d.getMonth() // 3
  5. d.getUTCMonth() // 3
  6. d.getDate() // 12
  7. d.getUTCDate() //12
  8. d.getDay() //5
  9. d.getUTCDay() //5
  10. d.getHours() //12
  11. d.getUTCHours() //4
  12. d.getMinutes() //30
  13. d.getSeconds() // 30
  14. d.getMilliseconds() // 0

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

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

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

  1. const d = new Date('2019-04-12 12:30:30');
  2. 1、先设置一个时间
  3. d.setFullYear('2018') // 1523507430000
  4. // 再去获取就改变了
  5. d.getFullYear() // 2018

setTime() 使用毫秒的格式,设置一个Date对象的值
set[UTC]FullYear() 设置年份(4位数),以及可选的月份值和日期值
set[UTC]Month() 设置月份(0-11),以及可选的日期值
set[UTC]Date() 设置第几天(1-31)
set[UTC]Hours() 设置小时值(0-23),以及可选的分钟值、秒值及毫秒值
set[UTC]Minutes() 设置分钟值(0-59),以及可选的秒值及毫秒值
set[UTC]Seconds() 设置秒值(0-59),以及可选的毫秒值
set[UTC]Milliseconds() 设置毫秒值(0-999)

日期格式化方案

  1. Date.prototype.format = function(fmt) {
  2. var o = {
  3. "M+" : this.getMonth()+1, //月份
  4. "d+" : this.getDate(), //日
  5. "h+" : this.getHours(), //小时
  6. "m+" : this.getMinutes(), //分
  7. "s+" : this.getSeconds(), //秒
  8. "q+" : Math.floor((this.getMonth()+3)/3), //季度
  9. "S" : this.getMilliseconds() //毫秒
  10. };
  11. // 正则匹配y
  12. if(/(y+)/.test(fmt)) {
  13. // RegExp.$1 = yyyy
  14. fmt=fmt.replace(RegExp.$1, (this.getFullYear()+"").substr(4 - RegExp.$1.length));
  15. }
  16. // 分别取用正则去匹配和替换月日时分秒
  17. for(var k in o) {
  18. if(new RegExp("("+ k +")").test(fmt)){
  19. fmt = fmt.replace(RegExp.$1, (RegExp.$1.length==1) ? (o[k]) : (("00"+ o[k]).substr((""+ o[k]).length)));
  20. }
  21. }
  22. return fmt;
  23. };
  24. // 使用
  25. const time = new Date().format("yyyy-MM-dd hh:mm:ss");

[注意]这是一个简单版本的时间格式化工具,有很多情况并未完全考虑到。

JavaScript Date日期对象以及日期格式化方法的更多相关文章

  1. 学习笔记:javascript内置对象:日期对象

    2.日期对象的常用函数 2.日期对象的常用函数   Date 对象方法 方法 描述 Date() 返回当日的日期和时间. getDate() 从 Date 对象返回一个月中的某一天 (1 ~ 31). ...

  2. JavaScript Date 时间对象方法

    Date(日期/时间对象) Date 操作日期和时间的对象 Date.getDate( ) 返回一个月中的某一天 Date.getDay( ) 返回一周中的某一天 Date.getFullYear( ...

  3. JS日期对象扩展-日期格式化

    日期对象扩展(日期格式化)yyyy-MM-dd hh:mm:ss.S Date.prototype.format = function(fmt) { var o = { "M+" ...

  4. 全面理解Javascript中Function对象的属性和方法

    http://www.cnblogs.com/liontone/p/3970420.html 函数是 JavaScript 中的基本数据类型,在函数这个对象上定义了一些属性和方法,下面我们逐一来介绍这 ...

  5. JavaScript中判断对象类型的种种方法

    我们知道,JavaScript中检测对象类型的运算符有:typeof.instanceof,还有对象的constructor属性: 1) typeof 运算符 typeof 是一元运算符,返回结果是一 ...

  6. 转 JavaScript中判断对象类型的种种方法

    我们知道,JavaScript中检测对象类型的运算符有:typeof.instanceof,还有对象的constructor属性: 1) typeof 运算符 typeof 是一元运算符,返回结果是一 ...

  7. 用JAVA编写浏览器内核之实现javascript的document对象与内置方法

    原创文章.转载请注明. 阅读本文之前,您须要对浏览器怎样载入javascript有一定了解. 当然,对java与javascript本身也须要了解. 本文首先介绍浏览器载入并执行javascript的 ...

  8. javascript基本属性访问对象的属性和方法

    var myName = "Shelley"; //字符串基本类型 alert(myName.length);  //隐式创建String对象,数值与myName相同,并执行len ...

  9. JavaScript的事件对象_其他属性和方法

    在标准的 DOM 事件中,event 对象包含与创建它的特定事件有关的属性和方法.触发的事件类型不一样,可用的属性和方法也不一样. 在这里,我们只看所有浏览器都兼容的属性或方法.首先第一个我们了解一下 ...

随机推荐

  1. Zookeeper与Kafka基础概念和原理

    1.zookeeper概念介绍 在介绍ZooKeeper之前,先来介绍一下分布式协调技术,所谓分布式协调技术主要是用来解决分布式环境当中多个进程之间的同步控制,让他们有序的去访问某种共享资源,防止造成 ...

  2. Vue学习之路2-项目初搭建

    1.检查环境是否全部安装成功 2.创建项目 2.1.打开dos命令窗口,使用dos命令转到项目文件夹下: 2.2.输入创建项目命令:vue init webpack myproject1 创建不同的打 ...

  3. docker容器日志收集方案(方案四,目前使用的方案)

    先看数据流图,然后一一给大家解释 ​ 这个方案是将日志直接从应用代码中将日志输出到redis中(注意,是应用直接连接redis进行日志输出),redis充当一个缓存中间件有一定的缓存能力,不过有限,因 ...

  4. 基于Angular和Spring WebFlux做个小Demo

    前言 随着Spring Boot2.0正式发布,Spring WebFlux正式来到了Spring Boot大家族里面.由于Spring WebFlux可以通过更少的线程去实现更高的并发和使用更少的硬 ...

  5. react组件之间的通信

    通过props传递 共同的数据放在父组件上, 特有的数据放在自己组件内部(state),通过props可以传递一般数据和函数数据, 只能一层一层传递 一般数据-->父组件传递数据给子组件--&g ...

  6. springboot + mybatis +pageHelper分页排序

    今天下午写查出来的数据的排序,原来的数据没有排序,现在把排序功能加上...原来用的,是xml中的sql动态传参 ,,1个小数没有弄出来,果断放弃... 网上百度一下,发现用pageHelper  可以 ...

  7. 替换空格[by Python]

    题目: 请实现一个函数,将一个字符串中的空格替换成“%20”.例如,当字符串为We Are Happy.则经过替换之后的字符串为We%20Are%20Happy. 1.使用python自带的repla ...

  8. VMware Workstation中安装linux系统(CentOS)超详细(部分转载)

    首先准备一下VMware虚拟机和linux镜像文件,链接如下: 对于32位windows机子安装的是10.0.7版本的VMware Workstation,链接: https://pan.baidu. ...

  9. nodeJS之crypto模块md5和Hmac加密

    nodeJS之crypto模块md5和Hmac加密 原文地址:https://www.cnblogs.com/tugenhua0707/p/9128690.html 在nodejs中,可以使用cryp ...

  10. 学号 20175329 2018-2019-3《Java程序设计》第九周学习总结

    学号 20175329 2018-2019-3<Java程序设计>第八周学习总结 教材学习内容总结 第十五章 泛型 可以使用"class 名称"声明一个类,为了和普通的 ...