原生JS:Date对象全面解析


Posted in Javascript onSeptember 06, 2016

Date对象:基于1970年1月1日(世界标准时间)起的毫秒数
本文参考MDN做的详细整理,方便大家参考MDN

构造函数:

1.new Date(); 依据系统设置的当前时间来创建一个Date对象。

2.new Date(value); value代表自1970年1月1日00:00:00 (世界标准时间) 起经过的毫秒数。

3.new Date(dateString); dateString表示日期的字符串值。该字符串应该能被 Date.parse() 方法识别(符合 IETF-compliant RFC 2822 timestamps 或 version of ISO8601)

4.new Date(year, month[, day[, hour[, minutes[, seconds[, milliseconds]]]]]);

year 1900 年后的某一年份,代表年份的整数值。为了避免2000年问题最好指定4位数的年份; 使用 1998, 而不要用 98.

month 0 到 11 之间的一个整数,表示月份(1月)到11(12月)。

day 1 到 31 之间的一个整数,表示某月当中的第几天。

hour 0 到 23 之间的一个整数,表示小时。

minute 0 到 59 之间的一个整数,表示分钟。。

second 0 到 59 之间的一个整数,秒数。

millisecond 0 到 999 之间的一个整数,表示时间的毫秒部分的整数值。

如果提供了至少两个参数,其余的参数均会默认设置为1(如果没有提供day参数)或者0。

JavaScript的时间是由世界标准时间(UTC)1970年1月1日开始,用毫秒计时,一天由86,400,000毫秒组成。Date对象的范围是-100,000,000天至100,000,000天(等效的毫秒值)。

JavaScript的Date对象为跨平台提供了统一的行为。时间属性可以在不同的系统中表示相同的时刻,而如果使用了本地时间对象,则反映当地的时间。

JavaScript 的Date对象提供了数个UTC时间的方法,也相应提供了当地时间的方法。UTC,也就是我们所说的格林威治时间,指的是time中的世界时间标准。而当地时间则是指执行JavaScript的客户端电脑所设置的时间。

以一个函数的形式来调用JavaScript的Date对象(不使用 new 操作符)会返回一个代表当前日期和时间的字符串。而不是一个日期对象。另外,不像其他JavaScript 类型,Date 对象没有字面量格式。

当Date作为构造函数调用并传入多个参数时,如果数值大于合理范围时(如月份为13或者分钟数为70),相邻的数值会被调整。比如 new Date(2013, 13, 1)等于new Date(2014, 1, 1),它们都表示日期2014-02-01(注意月份是从0开始的)。其他数值也是类似,new Date(2013, 2, 1, 0, 70)等于new Date(2013, 2, 1, 1, 10),都表示时间2013-03-01T01:10:00。

当Date作为构造函数调用并传入多个参数时,所定义参数代表的是当地时间。如果需要世界协调时,使用 new Date({{jsxref("Date.UTC()", "Date.UTC(...)")}}) 和相同参数

属性:

Date.prototype :允许为 Date 实例对象添加属性。

Date.length:值是 7。这是该构造函数可接受的参数个数。

Date静态方法:

Date.now() IE9

返回自 1970-1-1 00:00:00 UTC (时间标准时间)至今所经过的毫秒数,类型为Number。

在支持 Web Performance API 的高精细度(high-resolution)时间功能的浏览器中,window.performance.now 提供的所经过的时间比 Date.now 更可靠和精确。

兼容旧版浏览器:

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

Date.parse()

解析一个表示日期的字符串,并返回从 1970-1-1 00:00:00 所经过的毫秒数。如果参数不能解析为一个有效的日期,则返回NaN。

parse 方法接受一个日期字符串(例如 "Dec 25, 1995"),并返回从1970-1-1 00:00:00 UTC到该日期字符串所表示日期的毫秒数。该方法在基于字符串值设置日期值时很有用,例如结合使用setTime() 方法和 Date() 构造函数。

该方法可以接受符合 RFC2822 / IETF 日期语法 (RFC2822 Section 3.3) 的字符串,如 "Mon, 25 Dec 1995 13:30:00 GMT"。该方法能够理解美国大陆时区的缩写,但是为了更通用,应该使用时区偏移,如 "Mon, 25 Dec 1995 13:30:00 +0430" (格林威治的子午线向东偏移4小时30分钟)。如果没有指定时区,默认使用本地时区。

GMT 和 UTC 被看作相等。 如果 RFC2822 Section 3.3 格式中不包含时区信息时,会以本地时区来解析日期字符串。

由于在解析日期字符串时存在偏差会导致结果不一致,因此推荐始终手动解析日期字符串,特别是不同的ECMAScript实现会把诸如“2015-10-12 12:00:00”的字符串解析为NaN,UTC或者本地时间。

另外,日期时间字符串也可以使用 ISO 8601 格式。例如,"2011-10-10" (仅日期)或 "2011-10-10T14:48:00" (日期和时间)能够作为参数被传递和解析

Date.UTC()

接受和构造函数最长形式的参数相同的参数(从2到7),并返回从 1970-01-01 00:00:00 UTC 开始所经过的毫秒数,类型为Number。

你应该指定一个完整格式的年份,如 1998

Date.UTC 方法使用协调世界时 代替 本地时间。

Date.UTC 方法返回一个时间数值,而不是一个日期对象。

如果有一个指定的参数超出其合理范围,则 UTC 方法会通过更新其他参数直到该参数在合理范围内。例如,为月份指定 15,则年份将会加 1,然后月份将会使用 3。

Date 实例方法:

根据本地时间的方法

获取时间方法:

Date.prototype.getDate()

根据本地时间返回指定日期对象的月份中的第几天(1-31)。

Date.prototype.getDay()

根据本地时间返回指定日期对象的星期中的第几天(0-6)。

Date.prototype.getFullYear()

根据本地时间返回指定日期对象的年份,该方法返回一个1000 到 9999的四位数字年份,请使用该方法代替 getYear 方法。

Date.prototype.getHours()

根据本地时间返回指定日期对象的小时(0-23)。

Date.prototype.getMilliseconds()

根据本地时间返回指定日期对象的微秒(0-999)。

Date.prototype.getMinutes()

根据本地时间返回指定日期对象的分钟(0-59)。

Date.prototype.getMonth()

根据本地时间返回指定日期对象的月份(0-11)。

Date.prototype.getSeconds()

根据本地时间返回指定日期对象的秒数(0-59)。

Date.prototype.getTime()

返回从1970-1-1 00:00:00 UTC(协调世界时)到该日期经过的毫秒数,Number类型,对于1970-1-1 00:00:00 UTC之前的时间返回负值。这个方法的功能和 valueOf() 方法一样。

Date.prototype.getTimezoneOffset()

返回协调世界时(UTC)相对于当前时区的时间差值,单位为分钟。

时区偏差(time-zone offset)表示协调世界时(UTC)与本地时区之间的差值,单位为分钟。需要注意的是如果本地时区晚于协调世界时,则该差值为正值,如果早于协调世界时则为负值

设置时间方法:以下方法如果有一个参数超出了合理的范围,该方法会更新其他参数值,日期对象的日期值也会被相应更新

Date.prototype.setDate(value)

根据本地时间为指定的日期对象设置月份中的第几天。

如果 value 超出了月份的合理范围,setDate 将会相应地更新 Date 对象。例如,如果为 value 指定0,那么日期就会被设置为上个月的最后一天,可以为负数。

Date.prototype.setFullYear(yearValue[, monthValue[, dayValue]])

根据本地时间为指定日期对象设置完整年份(四位数年份是四个数字)。

yearValue指定年份的整数值,例如1995。

monthValue一个0到11之间的整数值,表示从一月到十二月。

dayValue一个1到31之间的整数值,表示月份中的第几天。如果你指定了 dayValue 参数,就必须同时指定 monthValue。

如果没有指定 monthValue 和dayValue 参数,将会使用 getMonth 和getDate 方法的返回值

Date.prototype.setHours(hoursValue[, minutesValue[, secondsValue[, msValue]]])

根据本地时间为指定日期对象设置小时数。如果不指定 minutesValue,secondsValue 和 msValue 参数,则会使用getMinutes(),getSeconds() 和getMilliseconds() 方法的返回值。

参数超出了合理范围,自动调整更新

Date.prototype.setMilliseconds()

根据本地时间为指定日期对象设置毫秒数。

Date.prototype.setMinutes()

根据本地时间为指定日期对象设置分钟数。

Date.prototype.setMonth()

根据本地时间为指定日期对象设置月份。

Date.prototype.setSeconds()

根据本地时间为指定日期对象设置秒数。

Date.prototype.setTime(timeValue)

通过指定从 1970-1-1 00:00:00 UTC 开始经过的毫秒数来设置日期对象的时间,对于早于 1970-1-1 00:00:00 UTC的时间可使用负值。例:sameBigDay.setTime(newBigDay.getTime());

以世界时为标准的方法:

Date.prototype.getUTCDate()

以世界时为标准,返回一个指定的日期对象是一个月中的第几天,返回 1 到 31 的整数值

Date.prototype.getUTCDay()

以世界时为标准,返回一个指定的日期对象为一星期中的第几天,其中 0 代表星期天。

Date.prototype.getUTCFullYear()

以世界时为标准,返回一个指定的日期对象的年份,该方法返回一个1000 到 9999的四位数字年份

Date.prototype.getUTCHours()

以世界时为标准,返回一个指定的日期对象的小时数。

Date.prototype.getUTCMilliseconds()

以世界时为标准,返回一个指定的日期对象的毫秒数。.

Date.prototype.getUTCMinutes()

以世界时为标准,返回一个指定的日期对象的分钟数.

Date.prototype.getUTCMonth()

以世界时为标准,返回一个指定的日期对象的月份,它是从 0 开始计数的(0 代表一年的第一个月).

Date.prototype.getUTCSeconds()

以世界时为标准,返回一个指定的日期对象的秒数.

Date.prototype.setUTCDate()

根据世界时设置 Date 对象中月份的一天 (1 ~ 31)。

Date.prototype.setUTCFullYear()

根据世界时设置 Date 对象中的年份(四位数字)。

Date.prototype.setUTCHours()

根据世界时设置 Date 对象中的小时 (0 ~ 23)。

Date.prototype.setUTCMilliseconds()

根据世界时设置 Date 对象中的毫秒 (0 ~ 999)。

Date.prototype.setUTCMinutes()

根据世界时设置 Date 对象中的分钟 (0 ~ 59)。

Date.prototype.setUTCMonth()

根据世界时设置 Date 对象中的月份 (0 ~ 11)。

Date.prototype.setUTCSeconds()

根据世界时设置 Date 对象中的秒钟 (0 ~ 59)

日期格式转换:

Date.prototype.toDateString()

以人类易读(human-readable)的形式返回该日期对象日期部分的字符串。

Date.prototype.toISOString() IE9

返回一个 ISO(ISO 8601 Extended Format)格式的字符串: YYYY-MM-DDTHH:mm:ss.sssZ。时区总是UTC(协调世界时),加一个后缀“Z”标识

Date.prototype.toJSON()

返回一个 JSON 格式字符串(使用 toISOString()),表示该日期对象的值。默认情况下,这个方法常用于 JSON序列化Date对象。。为了在 JSON.stringify() 方法中使用。

Date.prototype.toLocaleDateString()

返回一个表示该日期对象日期部分的字符串,该字符串格式与系统设置的地区关联(locality sensitive)。其它同toLocaleTimeString()

Date.prototype.toLocaleString()

返回一个表示该日期对象的字符串,该字符串与系统设置的地区关联。覆盖了 Object.prototype.toLocaleString() 方法。其它同toLocaleTimeString()

Date.prototype.toLocaleTimeString([locales [, options]])

返回一个表示该日期对象时间部分的字符串,该字符串格式与系统设置的地区关联(locality sensitive)。

方法返回该日期对象日期部分的字符串,该字符串格式因不同语言而不同。新增的参数(IE11,而Safari无) locales 和 options 使程序能够指定使用哪种语言格式化规则,允许定制该方法的表现(behavior)。在旧版本浏览器中, locales 和 options 参数被忽略,使用的语言环境和返回的字符串格式是各自独立实现的

查看浏览器兼容性小节,看下哪些浏览器支持 locales 和 options 参数,还可以参看例子: 检测 locales 和 options 参数支持情况。

没有指定语言环境(locale)时,返回一个使用默认语言环境和格式设置(options)的格式化字符串。

locales 和 options 参数不是所有的浏览器都支持。为了检测一种实现环境(implementation)是否支持它们,可以使用不合法的语言标签,如果实现环境支持该参数,则会抛出一个 RangeError 异常,反之会忽略参数。

性能:当格式化大量日期时,最好创建一个 Intl.DateTimeFormat 对象,然后使用该对象 format 属性提供的方法。

Date.prototype.toString()

返回一个表示该日期对象的字符串,总是返回一个美式英语日期格式的字符串。覆盖了Object.prototype.toString() 方法。

Date.prototype.toTimeString()

以人类易读格式返回日期对象时间部分的字符串。

Date.prototype.toUTCString()

把一个日期对象转换为一个以UTC时区计时的字符串。

Date.prototype.valueOf()

返回从1970年1月1日0时0分0秒(UTC,即协调世界时)到该日期对象所代表时间的毫秒数。该方法的功能和 Date.prototype.getTime() 方法一样,覆盖了 Object.prototype.valueOf() 方法。

以上这篇原生JS:Date对象全面解析就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript高级学习笔记整理
Aug 14 Javascript
JS 表单验证大全
Nov 23 Javascript
jQuery父级以及同级元素查找介绍
Sep 04 Javascript
JavaScript操作XML文件之XML读取方法
Jun 09 Javascript
jQuery使用serialize()表单序列化时出现中文乱码问题的解决办法
Jul 27 Javascript
Angularjs中controller的三种写法分享
Sep 21 Javascript
使用vue-cli3 创建vue项目并配置VS Code 自动代码格式化 vue语法高亮问题
May 14 Javascript
Ajax请求时无法重定向的问题解决代码详解
Jun 21 Javascript
vue登录页面cookie的使用及页面跳转代码
Jul 10 Javascript
VUE 实现动态给对象增加属性,并触发视图更新操作示例
Nov 29 Javascript
浅谈vue获得后台数据无法显示到table上面的坑
Aug 13 Javascript
javascript使用正则表达式实现注册登入校验
Sep 23 Javascript
如何解决IONIC页面底部被遮住无法向上滚动问题
Sep 06 #Javascript
Vue.js每天必学之过渡与动画
Sep 06 #Javascript
Vue.js 父子组件通讯开发实例
Sep 06 #Javascript
Vuejs第十篇之vuejs父子组件通信
Sep 06 #Javascript
Vue.js每天必学之方法与事件处理器
Sep 06 #Javascript
基于JavaScript实现购物网站商品放大镜效果
Sep 06 #Javascript
AngularGauge 属性解析详解
Sep 06 #Javascript
You might like
php将时间差转换为字符串提示
2011/09/07 PHP
CodeIgniter采用config控制的多语言实现根据浏览器语言自动转换功能
2014/07/18 PHP
php单例模式的简单实现方法
2016/06/10 PHP
php获取今日开始时间和结束时间的方法
2017/02/27 PHP
php实现微信公众平台发红包功能
2018/06/14 PHP
PHP异常类及异常处理操作实例详解
2018/12/19 PHP
php判断IP地址是否在多个IP段内
2020/08/18 PHP
JavaScript 动态将数字金额转化为中文大写金额
2009/05/14 Javascript
JavaScript 选中文字并响应获取的实现代码
2011/08/28 Javascript
jQuery中读取json文件示例代码
2013/05/10 Javascript
js控制不同的时间段显示不同的css样式的实例代码
2013/11/04 Javascript
jquery对单选框,多选框,文本框等常见操作小结
2014/01/08 Javascript
js打开windows上的可执行文件示例
2014/05/27 Javascript
js为什么不能正确处理小数运算?
2015/12/29 Javascript
jQuery插件之jQuery.Form.js用法实例分析(附demo示例源码)
2016/01/04 Javascript
js实现数组冒泡排序、快速排序原理
2016/03/08 Javascript
javascript表单处理具体实现代码(表单、链接、按钮)
2016/05/07 Javascript
vue-quill-editor实现图片上传功能
2017/08/08 Javascript
微信小程序仿美团城市选择
2018/06/06 Javascript
vue里input根据value改变背景色的实例
2018/09/29 Javascript
微信小程序时间标签和时间范围的联动效果
2019/02/15 Javascript
微信小程序scroll-view锚点链接滚动跳转功能
2019/12/12 Javascript
javascript事件循环event loop的简单模型解释与应用分析
2020/03/14 Javascript
js实现头像上传并且可预览提交
2020/12/25 Javascript
[40:10]2015国际邀请赛全明星表演赛
2015/08/07 DOTA
[36:29]2018DOTA2亚洲邀请赛 4.1 小组赛 A组加赛 LGD vs TNC
2018/04/02 DOTA
[01:01:23]完美世界DOTA2联赛PWL S2 Forest vs FTD.C 第一场 11.26
2020/11/30 DOTA
Python实现的数据结构与算法之基本搜索详解
2015/04/22 Python
python实现内存监控系统
2021/03/07 Python
python如何以表格形式打印输出的方法示例
2019/06/21 Python
Ruby如何创建一个线程
2013/03/10 面试题
小学生防溺水广播稿
2014/01/12 职场文书
大学生怎样写好自荐信
2014/02/25 职场文书
小学教师暑期培训心得体会
2016/01/09 职场文书
销区经理年终述职报告模板
2019/11/28 职场文书
如何搭建 MySQL 高可用高性能集群
2021/06/21 MySQL