date日期 和 date时间拼接_第22节 Date日期时间对象-Javascript-Web前端-零点程序员-王唯...

本内容是《Web前端开发之Javascript视频》的课件，请配合大师哥《Javascript》视频课程学习。

Date日期对象：用于处理日期和时间。

基本概念：

GMT：(Greenwich Mean Time)格林尼治标准时(格林威治)，这个时间系统的概念在 1884 年确立，由英国伦敦的格林威治皇家天文台(即本初子午线的位置)计算并维护。

UTC：(Universal Time Code 通用时间)，也叫格林尼治标准时间，(也称为：协调世界时、世界统一时间、世界标准时间、国际协调时间)。

时区：由于各国家与地区经度不同，地方时也有所不同； 1884年在华盛顿召开的一次国际经度会议，把全球划分为不同的时区，每隔经度15°划分一个时区，其被划分为24个时区，分为东12区和西12区。

夏令时：(Summer time)，又称日光节约时、日光节约时间，是一种为节约能源而人为规定地方时间的制度，在这一制度实行期间所采用的统一时间称为“夏令时间”。

计算机元年(纪年)：1970年1月1日0时0分0秒作为计算机元年，用于计时的开始。

时间戳：是一个自增的整数，它表示从1970年1月1日零时整的GMT时区开始的那一刻，到现在的毫秒数，时间戳可以精确地表示一个时刻，并且与时区无关。

Date使用的是UTC；是所有时区的基准标准时间，是1970年1月1日凌晨0点0分0秒开始经过的毫秒数保存日期；

在使用这种数据存储格式的条件下，Date()类型保存的日期能够精确到70年1月1日之前或之后的100 000 000天。

Date对象创建：

使用Date()构造函数，语法：var now = Date();

var d = new Date();  //以当前日期和时间创建Date对象var d = new Date(0);  //以距离1970.1.1:00:00:00的毫秒数创建Date对象var d = new Date(2020,7,18);console.log(d);

new Date()的参数很多种形式，每种都表示不同的含义；

如果传值为 0，会得到一个表示 1970年1月1日的Date 对象；

或者使用Date()函数，但本质上不一样，输出也不一样，实质上是一个转换函数；

说明：因为要传入是表示该日期的毫秒数(即从UTC时间70年1月1日前夜起到该日期止的毫秒数)。为了简化这一计算过程，ECMAScript提供了两个静态方法：Date.parse()和Date.UTC()；

Date.parse()方法接受一个表示日期的字符串参数，返回一个时间戳(毫秒数)；

日期字符串应该符合 RFC 2822 和 ISO 8061 这两个标准，ISO 8601扩展格式 YYYY-MM-DDTHH:mm:ss:ssssZ，如：2020-05-25T00:00:00；(yyyy4位年份、MM月份、DD天、HH时、mm分、ss秒、ssss毫秒)

通常见的日期格式：

mm/dd/yyyy 如: 3/21/2009，即月/日/年

yyyy/mm/dd 如: 2009/3/21

mmmm dd,yyyy 如: Apr 21,2009，即英文月名 日，年，即January 12,2010

英文星期几 月 日 年 时：分：秒 时区，如：Tue May 25 2020 00:00:00 GMT-0700

var d = Date.parse("May 25,2020");Date.parse('2018-07-22')Date.parse('2018-07')Date.parse('2018')Date.parse('07/22/2018')Date.parse('2018/07/22')Date.parse('2018/7/22')Date.parse('July 22, 2018')Date.parse('July 22, 2018 07:22:13')Date.parse('2018-07-22 07:22:13')Date.parse('2018-07-22T07:22:13')

注：如果传入Date.parse()方法的字符串不能表示日期，那么它会返回NaN；

根据parse()返回值创建Date对象；

var d = new Date(Date.parse("May 25, 2020"));

实际上，如果直接将表示日期的字符串传递给Date构造函数，也会在后台调用Date.parse()，两者是等价的，如：

var d = new Date("May 25, 2020");

注：日期对象在不同浏览器实现的并不统一，比如，传入了超出范围的值：

var d = new Date("January 33,2020");

在解析January 33,2020，有些浏览器返回：Invalid Date；IE返回：Sun Feb 02 2020(把超出的时间往后自动推算)；

可以在月份或者日期字段添加或省略前导零；

console.log(new Date('2020-6-6'));console.log(new Date('2020-06-06'));console.log(new Date('2020-06-06 09:18:15'));console.log(new Date('2020-06-06T09:18:15'));console.log(new Date('2020-06'));console.log(new Date('2020'));console.log(new Date('06/07/2020'));console.log(new Date('2020/06/07'));console.log(new Date('2020/6/7'));console.log(new Date('2020.6.7'));console.log(new Date('2020.6.7 15:18:15'));console.log(new Date('July 18, 2020'));console.log(new Date('July 18, 2020 09:30:28'));console.log(new Date('18 July 2020'));console.log(new Date('18 July, 2020'));console.log(new Date('18 July 2020 09:30:28'));console.log(new Date('July 2020'));

其实Date在内部是使用时间戳实现的；

var d = new Date(1591866649132)console.log(d);

UNIX 时间戳的原因以秒(seconds)为单位。JavaScript 以毫秒(milliseconds)为单位记录时间。

可在使用UNIX 时间戳去实例化Date 对象；

var timestamp = 1591866649;var d = new Date(timestamp * 1000);console.log(d);

Date.UTC()方法：

返回表示日期的毫秒数，但它与Date.parse()在构建值时使用不同的信息，即与当前所在的时区相关，生成的日期都相对于计算机的时区；

语法：Date.UTC(year, month[, date[, hrs[, min[, sec[, ms]]]]])；

其参数为日期中的年,月(基于0),日,小时(0到23),分,秒,毫秒，其中年月必选；如果没有提供日，默认为1，如果省略其他参数，则统统默认为0；

至少应该是3个参数，但是大多数 JavaScript 引擎都能解析 2 个或 1 个参数；

var d = Date.UTC(2020);var d = Date.UTC(2020,6);  // 毫秒数1593561600000var d = new Date(Date.UTC(2020,6)); var d = new Date(Date.UTC(2020,6,6,17,55,55)); // 自动添加时区，返回当地日期和时间var d = new Date(2020,6,10); //月份从0开始,6即是7月console.log(d);

如果没有任何关于时区的信息，会将日期视为 UTC ，并自动执行到当前计算机时区的转换；

可以直接把UTC参数传递给Date()构造函数，如：

var d=new Date(2020,6); // Wed Jul 01 2020 00:00:00 GMT+0800 var d = new Date(2020,6,6,17,55,55); // 即为GMT时间console.log(d);

时区：

当初始化一个 Date 对象时可以选择时区，可以通过添加 +HOURS 的格式，或者通过一个被圆括号包裹的时区名来描述一个时区：

console.log(new Date());console.log(new Date('Jun 7,2020 13:51:01 +0700'));console.log(new Date('Jun 7,2020 13:51:01 (CET)'));   // CET欧洲中部时间

如果你使用时区名的方式但在圆括号中定义了一个错误的时区名，JavaScript 将会静默地将时区设置为默认的 UTC。

如果你使用 +HOURS 的方式但传入的数字格式是错误的，JavaScript 将会抛出一个 “Invalid Date” 的 Error。

继承的方法：

与其他引用类型一样，Date类型也重写了toLocaleString()、toString()和valueOf()方法；但这些方法的返回值与其他类型中的方法不同。

valueOf()方法：返回日期的毫秒数；

toString()方法：通常返回带有时区信息的日期和时间；其中时间一般以军用时间(即小时从0到23)；

toLocaleString()：会按照与浏览器设置的地区相适应的格式返回日期和时间；即时间格式中会包含AM或PM，但不会包含时区信息；

var d=new Date(2020,6); // Wed Jul 01 2020 00:00:00 GMT+0800 var d = new Date(2020,6,6,17,55,55); // 即为GMT时间console.log(d);

注：真实场景中，toString()和toLocaleString()没有什么用，仅在调试代码时使用；

至于valueOf()方法，返回的是毫秒数，因此，可以方便的使用比较操作来比较日期，如：

console.log(new Date());console.log(new Date('Jun 7,2020 13:51:01 +0700'));console.log(new Date('Jun 7,2020 13:51:01 (CET)'));   // CET欧洲中部时间

注意日期比较的惯性思维，如2019.1.1早于2020.2.1日，但后者返回的毫秒数大。

Date对象方法：

• Date()：返回当日的日期和时间。
• getDate()：从 Date 对象返回一个月中的某一天 (1 ~ 31)。
• getDay()：从 Date 对象返回一周中的某一天 (0 ~ 6)。
• getMonth()：从 Date 对象返回月份 (0 ~ 11)。
• getFullYear()：从 Date 对象以四位数字返回年份。
• getYear()：请使用 getFullYear() 方法代替。
• getHours()：返回 Date 对象的小时 (0 ~ 23)。
• getMinutes()：返回 Date 对象的分钟 (0 ~ 59)。
• getSeconds()：返回 Date 对象的秒数 (0 ~ 59)。
• getMilliseconds()：返回 Date 对象的毫秒(0 ~ 999)。
• getTime()：返回 1970 年 1 月 1 日至今的毫秒数，与valueOf()返回值相同。
• getTimezoneOffset()：返回本地时间与格林威治标准时间 (GMT) 的分钟差。
• getUTCDate()：根据世界时从 Date 对象返回月中的一天 (1 ~ 31)。
• getUTCDay()：根据世界时从 Date 对象返回周中的一天 (0 ~ 6)。
• getUTCMonth()：根据世界时从 Date 对象返回月份 (0 ~ 11)。
• getUTCFullYear()：根据世界时从 Date 对象返回四位数的年份。
• getUTCHours()：根据世界时返回 Date 对象的小时 (0 ~ 23)。
• getUTCMinutes()：根据世界时返回 Date 对象的分钟 (0 ~ 59)。
• getUTCSeconds()：根据世界时返回 Date 对象的秒钟 (0 ~ 59)。
• getUTCMilliseconds()：根据世界时返回 Date 对象的毫秒(0 ~ 999)。
• parse()：返回1970年1月1日午夜到指定日期(字符串)的毫秒数。
• setDate()：设置 Date 对象中月的某一天 (1 ~ 31)。
• setMonth()：设置 Date 对象中月份 (0 ~ 11)。
• setFullYear()：设置 Date 对象中的年份(四位数字)。
• setYear()：请使用 setFullYear() 方法代替。
• setHours()：设置 Date 对象中的小时 (0 ~ 23)。
• setMinutes()：设置 Date 对象中的分钟 (0 ~ 59)。
• setSeconds()：设置 Date 对象中的秒钟 (0 ~ 59)。
• setMilliseconds()：设置 Date 对象中的毫秒 (0 ~ 999)。
• setTime()：以毫秒设置 Date 对象。
• setUTCDate()：根据世界时设置 Date 对象中月份的一天 (1 ~ 31)。
• setUTCMonth()：根据世界时设置 Date 对象中的月份 (0 ~ 11)。
• setUTCFullYear()：根据世界时设置 Date 对象中的年份(四位数字)。
• setUTCHours()：根据世界时设置 Date 对象中的小时 (0 ~ 23)。
• setUTCMinutes()：根据世界时设置 Date 对象中的分钟 (0 ~ 59)。
• setUTCSeconds()：根据世界时设置 Date 对象中的秒钟 (0 ~ 59)。
• setUTCMilliseconds()：根据世界时设置 Date 对象中的毫秒 (0 ~ 999)。
• toSource()：返回该对象的源代码。
• toString()：把 Date 对象转换为字符串。
• toTimeString()：把 Date 对象的时间部分转换为字符串。
• toDateString()：把 Date 对象的日期部分转换为字符串。
• toGMTString()：请使用 toUTCString() 方法代替。
• toUTCString()：根据世界时，把 Date 对象转换为字符串。
• toLocaleString()：根据本地时间格式，把 Date 对象转换为字符串。
• toLocaleTimeString()：根据本地时间格式，把 Date 对象的时间部分转换为字符串。
• toLocaleDateString()：根据本地时间格式，把 Date 对象的日期部分转换为字符串。
• toISOString()：返回对应的UTC时间的 ISO8601 写法，如2012-12-31T16:00:00.000Z，
• toJSON()：返回值同toISOString()
• UTC()：根据世界时返回 1970 年 1 月 1 日 到指定日期的毫秒数。
• valueOf()：返回 Date 对象的原始值。

以上方法大概分为三种：to方法、get方法和set方法。

to方法-日期格式化方法：

date()类型还有一些专门用于将日期格式化为字符串的方法，如：

• toString()：
• toDateString()：以特定于实现的格式显示星期几、月、日和年；
• toTimeString()：以特定于实现的格式显示时、分、秒和时区；
• toLocaleDateString()：以特定于地区的格式显示星期几、月、日和年；
• toLocaleTimeString()：在特定于地区的格式显示 时、分、秒；
• toUTCString()：以特定于实现的格式显示UTC日期；
• toISOString()：返回ISO表示的日期；
• toGMTString()方法，这是一个与toUTCString()等价的方法，其存在的目的在于确保向后兼容；不过ECMAScript推荐使用toUTCString()方法；

getter方法：

用于获取当前日期时间信息；

var d = new Date();console.log(d.getDate()); //18console.log(d.getDay());  //4console.log(d.getFullYear()); //2020console.log(d.getMonth()); //5 (starts from 0)console.log(d.getHours()); //17console.log(d.getMinutes()); //30console.log(d.getSeconds()) //13console.log(d.getMilliseconds()); //765console.log(d.getTime()) //1591868420160console.log(d.getTimezoneOffset()); //-480 返回以分钟为单位表示的时区差异

getTimezoneOffset()方法用于说明某个时区与UTC时间的关系,该方法返回当前时区比UTC提前或落后的分钟数; 还可以用于判断该时区是否使用夏令时：

var d1=new Date(2020, 0, 1);var d2=new Date(2020, 6, 1);console.log(d1.getTimezoneOffset());  // -480 / 60 = -8小时var b=d1.getTimezoneOffset() != d2.getTimezoneOffset();  // 判断夏令时console.log(b);

这些方法有等效的UTC版本，它们返回UTC值而不是适合您当前时区的值

var d = new Date();console.log(d.getUTCDate()); //18console.log(d.getUTCDay());  //4console.log(d.getUTCFullYear()); //2020console.log(d.getUTCMonth()); //5 (starts from 0)console.log(d.getUTCHours()); //9console.log(d.getUTCMinutes()); //30console.log(d.getUTCSeconds()) //13console.log(d.getUTCMilliseconds()); //765

setter方法：

var d = new Date();d.setDate(6);d.setFullYear(2022);d.setMonth(4);d.setHours(4);d.setMinutes(4);d.setSeconds(4);d.setMilliseconds(123);d.setTime(1598765678999);console.log(d);

注：setDate 和 setMonth 从 0 开始编号；

这些方法基本是跟getter方法一一对应的，但是没有setDay方法，因为星期几是计算出来的，而不是设置的；

set方法中的参数如果超出它的范围，会进位，称为冒泡，如：date.setHours(48)，这也会将日期数变大；

var date = new Date();date.setFullYear(2022,1,18);// date.setMonth(24);date.setMonth(2,8);date.setHours(16,18,28,208);console.log(date.toLocaleString());

如果参数是负数，表示从上个月的最后一天开始减去相应的单位数:

以上的方法都有一个相对应的 UTC set方法：

var d = new Date();d.setUTCDate(6);d.setUTCFullYear(2022);d.setUTCMonth(4);d.setUTCHours(4);d.setUTCMinutes(4);d.setUTCSeconds(4);d.setUTCMilliseconds(123);console.log(d);

获取当前时间戳：

console.log(new Date().getTime());console.log(Date.now());

Date.now()方法返回表示调用这个方法时的日期和时间的毫秒数；其简化了Date.getTime()方法，如：

var start = Date.now();for(var i=0;i<100000;i++){} // 模拟其他处理代码var stop = Date.now();var result = stop-start;alert(result);

如果有些浏览器不支持Date.now()，可以使用+操作符获取Date对象的时间戳，如：

var start = +new Date();for(var i=0;i<100000;i++){} // 模拟其他处理代码var stop = +new Date();var result = stop-start;alert(result);

日期的计算：

直接加减或通过 Date.getTime() 的值来比较两个 Date 对象：

var d1 = new Date("2020-06-18");var d2 = new Date("2020-06-19");console.log(d1 - d2);  // -86400000console.log(d1 + d2);  // 返回两个日期的字符串拼接// 或var d1 = new Date('July 18,2020 14:10:18');var d2 = new Date('July 19,2020 14:10:18');var diff = d2.getTime() - d1.getTime();console.log(diff);

注：getTime() 方法返回以毫秒计的数字，所以需要将当日时刻计入；如：July 18, 2020 14:14:14 不等于July 18, 2020。在这种情况下，可以使用 setHours(0, 0, 0, 0) 来重置当日时刻；

计算本年度还剩下多少天：

function leftDays() {  var today = new Date();  var endYear = new Date(today.getFullYear(), 11, 31, 23, 59, 59, 999);  var msPerDay = 24 * 60 * 60 * 1000;  return Math.round((endYear.getTime() - today.getTime()) / msPerDay);}console.log(leftDays());

小练习：

// 中文月份和星期var d = new Date();var month = d.getMonth();var week = d.getDay();var monthArr = ['一月','二月','三月','四月','五月','六月','七月','八月','九月','十月','十一月','十二月'];var weekArr = ['星期日','星期一','星期二','星期三','星期四','星期五','星期六'];console.log(monthArr[month]);console.log(weekArr[week]); // 获取日期部分信息Date.prototype.datePart = function(part){    if(!part)        part = 'd';    var weekArr = ['日','一','二','三','四','五','六'];    switch(part){        case 'Y':        case 'y':             return this.getFullYear();             break;        case 'M':             return this.getMonth + 1;            break;        case 'W':        case 'w':            return weekArr[this.getDay()];            break;        case 'D':        case 'd':            return this.getDate();            break;        case 'H':        case 'h':            return this.getHours();            break;        case 'm':            return this.getMinutes();            break;        case 's':            return this.getSeconds();            break;        default:            return this.getDate();    }    return this.getDate();}console.log(new Date().datePart('d'));

还有多长时间退休：

// 一个人到退休还有多长时间function retireDays(birthday,age){    var d1 = new Date(birthday).getFullYear();    var d2 = new Date().getFullYear();    var old = d2 - d1;    console.log("现在你的年龄是：" + old,"，将于" + (d1 + age) + "退休");    if(age - old > 0){        console.log("还差"+(age - old)+"年退休")    }else{        console.log("你已经退休啦，好好享受老年生活吧");    }}retireDays('2020.6.6',60);

倒计时：