原生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 相关文章推荐
通过ifame指向的页面高度调整iframe的高度
Oct 05 Javascript
兼容ie和firefox js关闭代码
Dec 11 Javascript
js DOM的学习笔记
Dec 22 Javascript
javascript元素动态创建实现方法
May 13 Javascript
vue.js内部自定义指令与全局自定义指令的实现详解(利用directive)
Jul 11 Javascript
利用js将ajax获取到的后台数据动态加载至网页中的方法
Aug 08 Javascript
vue debug 二种方法
Sep 16 Javascript
移动端图片上传旋转、压缩问题的方法
Oct 16 Javascript
使用pkg打包Node.js应用的方法步骤
Oct 19 Javascript
VUE2.0 ElementUI2.0表格el-table自适应高度的实现方法
Nov 28 Javascript
基于vue和bootstrap实现简单留言板功能
May 30 Javascript
js实现飞机大战小游戏
Aug 26 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(1)
2006/10/09 PHP
延长phpmyadmin登录时间的方法
2011/02/06 PHP
TMDPHP 模板引擎使用教程
2012/03/13 PHP
PHP数据库万能引擎类adodb配置使用以及实例集锦
2014/06/12 PHP
微信API接口大全
2015/04/15 PHP
PHP日志LOG类定义与用法示例
2018/09/06 PHP
字符串的replace方法应用浅析
2011/12/06 Javascript
javascript中with()方法的语法格式及使用
2014/08/04 Javascript
Javascript堆排序算法详解
2014/12/03 Javascript
简介JavaScript中toTimeString()方法的使用
2015/06/12 Javascript
javascript的变量、传值、传址、参数之间关系
2015/07/26 Javascript
JavaScript使用DeviceOne开发实战(二) 生成调试安装包
2015/12/01 Javascript
JavaScript导航脚本判断当前导航
2016/07/12 Javascript
vue-swiper的使用教程
2018/08/30 Javascript
js实现鼠标拖拽缩放div实例代码
2019/03/25 Javascript
如何提升vue.js中大型数据的性能
2019/06/21 Javascript
一次让你了解全部JavaScript的作用域
2019/06/24 Javascript
selenium 反爬虫之跳过淘宝滑块验证功能的实现代码
2020/08/27 Javascript
vue组件是如何解析及渲染的?
2021/01/13 Vue.js
Jupyter安装nbextensions,启动提示没有nbextensions库
2020/04/23 Python
python3.5绘制随机漫步图
2018/08/27 Python
python文档字符串(函数使用说明)使用详解
2019/07/30 Python
Python GUI学习之登录系统界面篇
2019/08/21 Python
解决Pycharm的项目目录突然消失的问题
2020/01/20 Python
python 解决selenium 中的 .clear()方法失效问题
2020/09/01 Python
pymongo insert_many 批量插入的实例
2020/12/05 Python
YOINS官网:时尚女装网上购物
2017/03/17 全球购物
市场拓展计划书
2014/05/03 职场文书
小学生关于梦想的演讲稿
2014/08/22 职场文书
无房产证房屋转让协议书合同样本
2014/10/18 职场文书
2015年七夕爱情寄语
2015/03/24 职场文书
检讨书模板大全
2015/05/07 职场文书
2015年会计人员工作总结
2015/05/22 职场文书
postgresql使用filter进行多维度聚合的解决方法
2021/07/16 PostgreSQL
MySQL中varchar和char类型的区别
2021/11/17 MySQL
疑《守望先锋2》A测截图泄露 或将推出新模式、新界面
2022/04/03 其他游戏