JavaScript中的Date类型详解与moment简介

关于JavaScript中的Date类型,相信JSer们都不会陌生吧,但是也必然为那个复杂难记的各种转换函数所头疼,本文将分享一下我对JS中的Date类型的一些知识小总结,并把其中容易犯错的地方指出来,同时简介和推广moment.js这个js库,希望大家看完文章后以后在对Date类处理如鱼得水。

1 时间的唯一性与多样性

某一时刻在全世界任何地区应该是唯一的,时区的不同是为了让地球不同时区的人的中午十二点都是太阳正上当头,形成交流上没有那么多障碍。而这一标准就是大家熟知的格林威治标准时间(Greenwich Mean Time,又称世界时,简称GMT),GMT时间的准确度为每日数毫秒,对于这种情况,协调世界时(Coordinated Universal Time,简称UTC)出现了,准确度为每日数纳秒。UTC用1970
年1 月1 日午夜(零时)开始经过的毫秒数来保存日期。标准的出现并没有让我们的JavaScript对于时间处理变得简单,因为全世界时区的不同,所以你提供的是UTC时间还是本地时间对处理的结果很重要,同样的,结果显示UTC时间还是本地时间很多时候也相差了一个时区。

2 将已知信息转换为Date类

   构造函数new Date()中传参

Date 构造函数而不传递参数的情况下,新创建的对象自动获得当前日期和时间。如果想根据特定的日期和时间创建日期对象,必须传入表示该日期的毫秒数(即从UTC 时间1970 年1 月1 日午夜起至该日期止经过的毫秒数)。所以new Date(0)即为UTC时间1970 年1 月1 日00:00:00.000,但是传入若为表示时间的字符串,则会自动调用传入ECMAScript
的Date.parse()方法将字符串转化成对应距离GMT标准时间的毫秒数,例如new Date("May 25, 2004")和new Date(Date.parse("May 25, 2004"))创建的是同一时刻的Date类。然而Date.parse()这个方法的行为因实现而异,而且通常是因地区而异,所以对于代码的跨域跨平台是一道隐患,不推荐使用。

如同模仿Date.parse()一样,Date 构造函数也会模仿Date.UTC(),Date.UTC()方法同样也返回表示日期的毫秒数,但它与Date.parse()在构建值时使用不同的信息。Date.UTC()的参数分别是年份、基于0 的月份(一月是0,二月是1,以此类推)、月中的哪一天(1
到31)、小时数(0 到23)、分钟、秒以及毫秒数。在这些参数中,只有前两个参数(年和月)是必需的。如果没有提供月中的天数,则假设天数为1;如果省略其他参数,则统统假设为0。以下是两个使用Date.UTC()方法的例子:

var y2k = new Date(Date.UTC(2000, 0));                                                // GMT 时间2000
年1 月1 日午夜零时

var allFives = new Date(Date.UTC(2005, 4, 5, 17, 55, 55));                    //
GMT 时间2005 年5 月5 日17:55:55

但是,是不是new Date(Date.UTC(2005, 4, 5,
17, 55, 55))和new Date(2005, 4, 5, 17, 55, 55)创建的是同一时刻的Date类呢?答案是否定的!new Date()日期和时间都基于本地时区而非GMT 来创建的,也就是new Date(2005, 4, 5, 17, 55, 55)创建的是本地
时间2005 年5 月5 日17:55:55,若代码执行环境是中国(GMT+08),就对应的是创建GMT 时间2005 年5 月5 日09:55:55,所以很多时候我们会在这里犯错。

总结下来,new Date()构造函数传参方法很容易出错,而且对于字符串的支持格式还很有限,例如我得到的字符串是“12-10-27 09:00:00 PM”,我们要一步一步把它转换成可以放进new Date()里的字符串也是相当麻烦的过程,所以我推荐大家使用moment.js

moment.js传参

其实moment.js是“冒充”继承了Date构造函数的一个类,所以上述new Date()的规则对它来说都是可以的。例如,上述的“12-10-27 09:00:00 PM",我们就可以用moment("12-10-27
09:00:00 PM",  "YY-MM-DD hh-mm-ss A")就可以了。需要注意的是moment.js也无可避免的会出现上述的本地时间还是GMT时间的问题,如果没有在传参的字符串没有时区信息也会按本地时间去处理,所以只要注意这一点了,还是大大简化了我们的工作的。

3 将Date类转换成目标信息

原生Date类的方法已经足够去把一个Date类转换成各种信息,当然如果是用了上述moment.js生成的moment类,它的转换字符串format方法只会比原生的Date类方法有过之而无不及,这里就只是把原生方法介绍一下了。

· toString                               ------- (new Date()).toString()

------- "Sun Apr 24 2016 15:44:02 GMT+0800 (??-???? ?????—?é—′)"    //输出信息因地区和浏览器变化

· toUTCString                          ------- (new Date()).toUTCString()

------- "Sun, 24 Apr 2016 07:42:41 GMT"                                             // 输出信息格式恒定

· getTimezoneOffset()             -------
返回本地时间与UTC时间相差的分钟数。例如,美国东部标准时间返回300。在某地进入夏令时

的情况下,这个值会有所变化

· getTime()                              ------- 返回表示日期的毫秒数;与valueOf()方法返回的值相同

· setTime(毫秒)                        ------- 以毫秒数设置日期,会改变整个日期

· getFullYear()                         ------- 取得4位数的年份(如2007而非仅07)

· getUTCFullYear()                   ------- 返回UTC日期的4位数年份

· setFullYear(年)                      ------- 设置日期的年份。传入的年份值必须是4位数字(如2007而非仅07)

· setUTCFullYear(年)                ------- 设置UTC日期的年份。传入的年份值必须是4位数字(如2007而非仅07)

· getMonth()                          ------- 返回日期中的月份,其中0表示一月,11表示十二月

· getUTCMonth()                    ------- 返回UTC日期中的月份,其中0表示一月,11表示十二月

· setMonth(月)                        ------- 设置日期的月份。传入的月份值必须大于0,超过11则增加年份

· setUTCMonth(月)                  ------- 设置UTC日期的月份。传入的月份值必须大于0,超过11则增加年份

· getDate()                             ------- 返回日期月份中的天数(1到31)

· getUTCDate()                       ------- 返回UTC日期月份中的天数(1到31)

· setDate(日)                          ------- 设置日期月份中的天数。如果传入的值超过了该月中应有的天数,则增加月份

· setUTCDate(日)                    ------- 设置UTC日期月份中的天数。如果传入的值超过了该月中应有的天数,则增加月份

· getDay()                              ------- 返回日期中星期的星期几(其中0表示星期日,6表示星期六)

· getUTCDay()                        ------- 返回UTC日期中星期的星期几(其中0表示星期日,6表示星期六)

· getHours()                           ------- 返回日期中的小时数(0到23)

· getUTCHours()                     ------- 返回UTC日期中的小时数(0到23)

· setHours(时)                        ------- 设置日期中的小时数。传入的值超过了23则增加月份中的天数

· setUTCHours(时)                  ------- 设置UTC日期中的小时数。传入的值超过了23则增加月份中的天数

· getMinutes()                        ------- 返回日期中的分钟数(0到59)

· getUTCMinutes()                  ------- 返回UTC日期中的分钟数(0到59)

· setMinutes(分)                      ------- 设置日期中的分钟数。传入的值超过59则增加小时数

· setUTCMinutes(分)                ------- 设置UTC日期中的分钟数。传入的值超过59则增加小时数

· getSeconds()                        ------- 返回日期中的秒数(0到59)

· getUTCSeconds()                  ------- 返回UTC日期中的秒数(0到59)

· setSeconds(秒)                    
------- 设置日期中的秒数。传入的值超过了59会增加分钟数

· setUTCSeconds(秒)               ------- 设置UTC日期中的秒数。传入的值超过了59会增加分钟数

· getMilliseconds()                  ------- 返回日期中的毫秒数

· getUTCMilliseconds()            ------- 返回UTC日期中的毫秒数

· setMilliseconds(毫秒)            ------- 设置日期中的毫秒数

· setUTCMilliseconds(毫秒)      ------- 设置UTC日期中的毫秒数

时间: 2024-10-16 18:29:25

JavaScript中的Date类型详解与moment简介的相关文章

javascript中=、==、===区别详解

javascript中=.==.===区别详解今天在项目开发过中发现在一个小问题.在判断n==""结果当n=0时 n==""结果也返回了true.虽然是个小问题,却有着大影响,所以决定深入分析下.1.= 赋值运算符 //例: var n=1; console.log(n);//1 n=n+1; console.log(n);//2 2.== 值比较运算符 值比较运算符在表达式两边的数据类型不一致时,会隐式转换为相同数据类型,然后对值进行比较. //例: var a=

JavaScript中的Date类型

ECMAScript中的Date类型是在早起Java中的java.util.Date类基础上构建的.为此,Date类型使用自UTC(Coordinated Universal Time,国际协调时间)1970年1月1日0时开始经过的毫秒数来保存日期.在使用这种数据存储格式的条件下,Date类型保存的日期能够精确到1970年1月1日之前或之后的100000000年. 要创建一个日期对象,使用new操作符合Date构造函数即可. var now = new Date(); 在调用Date构造函数而不

Elasticsearch date 类型详解

引言 一直对 elasticsearch 中的 date 类型认识比较模糊,而且在使用中又比较常见,这次决定多花些时间,彻底弄懂它,希望能对用到的同学提供帮助. 注意:本文测试使用是 elasticsearch 6.3 版本,其他版本规则可能有所变化,如遇到不兼容的情况,还请参考 官方文档 Date 数据类型 elasticsearch 数据是以 JSON 格式存储的,而 JSON中是并没有 date 数据类型,因此 Elasticsearch 中虽然有 date 类型,但在展示时却要转化成另外

Java中Date类型详解

一.Date类型的初始化 1. Date(int year, int month, int date); 直接写入年份是得不到正确的结果的. 因为java中Date是从1900年开始算的,所以前面的第一个参数只要填入从1900年后过了多少年就是你想要得到的年份. 月需要减1,日可以直接插入. 这种方法用的比较少,常用的是第二种方法. 2. 这种方法是将一个符合特定格式,比如yyyy-MM-dd,的字符串转化成为Date类型的数据. 首先,定义一个Date类型的对象 Date date = nul

Javascript中prototype属性的详解

原文链接:http://www.cnblogs.com/Uncle-Keith/p/5834289.html 在典型的面向对象的语言中,如java,都存在类(class)的概念,类就是对象的模板,对象就是类的实例.但是在Javascript语言体系中,是不存在类(Class)的概念的,javascript中不是基于‘类的’,而是通过构造函数(constructor)和原型链(prototype chains)实现的.但是在ES6中提供了更接近传统语言的写法,引入了Class(类)这个概念,作为对

javascript 中的 this 关键字详解

1.javascript 中 什么是 this? this 指的是当前行为执行的主体,或者是当前方法执行的主体 context:是当前行为或者方法执行的环境 实例: xx 去北京饭店吃东西:上下文是“北京饭店”, this 是 xx 2. 那么如何判断一个函数在执行的时候,函数体内的 this 关键字是谁呢?主要有以下几条规律:  1)一个函数体内的 this 关键字和这个函数的在哪里定义,哪里执行都没有关系;   2) 判断一个方法执行的时候,函数的执行主体是谁?主要看方法前面有没有点(.),

JavaScript中的Array数组详解

ECMAScript中的数组与其他多数语言中的数组有着相当大的区别,虽然数组都是数据的有序列表,但是与其他语言不同的是,ECMAScript数组的每一项可以保存任何类型的数据.也就是说,可以用数组的第一个位置来保存字符串,第二个位置保存数值,第三个位置保存对象,而且ECMAScript数组的大小是可以动态调整的,即可以随着数据的添加自动增长以容纳新增数据. 数组的创建 创建数组的基本方式有两种,第一种是使用Array构造函数. var arr = new Array(); 如果预先知道数组要保存

JavaScript中的跨域详解(内附源码)

什么是跨域? 什么是跨域? 所谓跨域,就是如果在不同的域名下面存在数据交互,这个时候就会存在跨域的问题,这里要说明的是在同一个网站不同的文件夹下的数据交互是不存在跨域问题的. 哪些情况下存在跨域问题? 主域和子域之间会存在跨域问题(比如 www.a.com 和 www.a.b.com). 不同的域名存在跨域问题,哪怕这两个域名指向的是同一个ip地址. 为什么 ajax 不可以跨域? 因为 ajax 是通过 XMLHttpRequest 这个对象来进行数据之间的交互的,而 XMLHttpReque

JavaScript中数组Array方法详解

ECMAScript 3在Array.prototype中定义了一些很有用的操作数组的函数,这意味着这些函数作为任何数组的方法都是可用的. 1.Array.join()方法 Array.join()方法将数组中所有元素都转化为字符串并连接在一起,返回最后生成的字符串.可以指定一个可选的符号或字符串在生成的字符串中来分隔数组的各个元素.如果不指定分隔符,默认使用逗号.注意:此方法不会改变原始数组 var arr = ['a', 'b', 'c']; console.log(arr.join());