本文是 重温基础 系列文章的第七篇。 今日感受:做好自律。

系列目录:

  • 【复习资料】ES6/ES7/ES8/ES9资料整理(个人整理)
  • 【重温基础】1.语法和数据类型
  • 【重温基础】2.流程控制和错误处理
  • 【重温基础】3.循环和迭代
  • 【重温基础】4.函数
  • 【重温基础】5.表达式和运算符
  • 【重温基础】6.数字

本章节复习的是JS中的时间对象,一些处理的方法。

前置知识
JavaScript中的时间是以1970年1月1日00:00:00以来的毫秒数来储存数据类型。
Data对象的范围是相对距离UTC1970年1月1日的前后100,000,000天。
创建一个时间对象:

let d = new Date([params]);
复制代码

参数params可以是:

  • 无参数:默认创建今天的日期和时间。
  • 一个符合以下格式的表示日期的字符串:

"月 日, 年 时:分:秒."或者"年月日 时分秒"

let d = new Date("2018-12-20");
复制代码

如果你省略时、分、秒,那么他们的值将被设置为0。

  • 一个年,月,日的整型值的集合:
let d = new Date(2018, 12, 20);
复制代码
  • 一个年,月,日,时,分,秒的集合:
let d = new Date(2018, 12, 20, 23, 20, 10);
复制代码

这里Date对象涉及到的方法特别多,请移步W3school JavaScript Date 对象

1.Date对象的方法

常用处理的方法有以下几类:

  • "set":用于设置Date对象的日期和时间的值。
  • "get":用去获取Date对象的日期和时间的值。
  • "to":用于返回Date对象的字符串格式的值。
  • "parseUTC":用于解析Date字符串。

需要注意的Date对象的一些数值问题:

  • 秒/分: 0 - 59;
  • 时: 0 - 23;
  • 星期: 0(周日) - 6(周六)
  • 日期: 1 - 31
  • 月份: 0(一月) - 11(十二月)
  • 年份: 从1900开始的年数

例如:

let d = new Date('2018-12-10');
let d1 = d.getMonth();    // 11
let d2 = d.getFullYear(); // 2018
复制代码

获取今年剩下的天数:

let d = new Date();
let e = new Date(2018, 11, 31, 23, 59, 59, 999);  // 设置年月日时分秒
e.setFullYear(d.getFullYear); // 设置为今年
let m = 24 * 60 * 60 * 1000;  // 每日毫秒数
let result = (e.getTime() - d.getTime()) / m;
result = Math.round(result);  // 返回今年剩余天数
复制代码

这里Date对象涉及到的方法特别多,请移步W3school JavaScript Date 对象

注意:

格林尼治标准时间(GMT)英国、爱尔兰、冰岛和葡萄牙属于该时区。这个时区与中国北京时间的时差是8个小时,也就是说比北京时间晚8个小时。

2.使用Date对象

2.1 设置日期

为一个时间对象设置指定日期(2018年12月20日),注意这里:和前面说的一样,12月在JS的Date对象中,是用11表示。

let d = new Date();
d.setFullYear(2018,11,20);
复制代码

设置时间对象10天以后:

let d = new Date();
d.setDate(d.getDate() + 10); // 先获取当天的日期,再设置到指定天数以后
复制代码

2.2 比较时间

通常情况下,像下面这样简单比较:

let d = new Date();
let e = new Date();
d.setFullYear(2018,10,10);
let r = d > e ? 'good' : 'nice' ; // nice
复制代码

还可以比较两个日期相差多少天:

let d1 = new Date('2018-10-10');
let d2 = new Date('2018-11-11');
let d3 = (d2 - d1) / (1000 * 60 * 60 * 24);  // 32
复制代码

2.3 计算N天后星期几

function d (num){if(typeof Number(num) === 'number'){let d1 = new Date();let d2 = d1.setDate(d1.getDate() + Number(num));let n = new Date(d2).getDay();let s = '';switch (n){case 0 : s = "星期天";break;case 1 : s = "星期一";break;case 2 : s = "星期二";break;case 3 : s = "星期三";break;case 4 : s = "星期四";break;case 5 : s = "星期五";break;case 6 : s = "星期六";break;}return s;}else {alert('请输入正确数字!');}
}
复制代码

2.4 格式化日期

常见的日期格式化为字符串的方法有这些:

  • toDateString()——以特定于实现的格式显示星期几、月、日和年;

  • toTimeString()——以特定于实现的格式显示时、分、秒和时区;

  • toLocaleDateString()——以特定与地区的格式显示星期几、月、日和年;

  • toLocaleTimeString()——以特定于实现的格式显示时、分、秒;

  • toUTCString()——以特定于实现的格式完整的UTC日期。

获取并格式化日期:年-月-日

function d (date){return date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate();
}
d(new Date()); // "2018-12-20"
复制代码

日期字符串转为 年-月-日

function d (str){return new Date(Date.parse(str.replace(/-/g, '/')));// 或者// return new Date(str.replace(/-/g, '/'));
}
复制代码

获取当前星期几

let d = "今天是星期" + "日一二三四五六".charat(new Date().getDay());
复制代码

2.5 获取某年某月的天数

这里有个小技巧,若给new Date()传入一个如aaaa/aa/0参数时,可以得到aa月的前一个月的最后一天,如传入2018/12/0会得到2018/11/30

值得注意的是: 在Chrome浏览器上并不支持,会返回Invalid Date导致结果为NaN,但是我们可以使用aaaa,aa,0形式作为参数,下面分别写出这两种:

// aaaa/aa/0形式 只要传入年和月
function d (y, m){m = parseInt(m, 10) + 1;let r = new Date(y + '/' + m + '/0');return r.getDate();
}// aaaa,aa,0形式 只要传入年和月
function d (y, m){m = parseInt(m, 10) + 1;let r = new Date(y, m, 0);return r.getDate();
}
复制代码

2.6 获取上个月/下个月日期("yyyy-mm-dd")

传入参数的格式"yyyy-mm-dd",其实也可以是Date()对象,大家可以自行尝试。

// 上个月 date格式"yyyy-mm-dd"
function my_date (date){let arr = date.split('-');let y = arr[0] , m = arr[1], d = arr[2];  // 获取当前的年月日// ES6语法 let [y,m,d] = arr;let day = new Date(y,m,0);day = day.getDate(); // 获取当前月份的天数let y2 = y, m2 = parseInt(m) - 1;if(m2 == 0){y2 = parseInt(y2) -1;m2 = 12;}let d2 = d, day2 = new Date(y2, m2, 0);day2 = day2.getDate();if(d2 > day2){d2 = day2;}if(m2 < 10){m2 = '0' + m2;}return y2 + '-' + m2 + '-' + d2;
}
my_date('2018-1-20');  //"2017-12-20"
复制代码

下个月的计算方法也是相似:

// 上个月 date格式"yyyy-mm-dd"
function my_date (date){let arr = date.split('-');let y = arr[0] , m = arr[1], d = arr[2];  // 获取当前的年月日let day = new Date(y,m,0);day = day.getDate(); // 获取当前月份的天数// 和计算上个月的区别   let y2 = y, m2 = parseInt(m) + 1;if(m2 == 13){   y2 = parseInt(y2) + 1;m2 = 1;}let d2 = d, day2 = new Date(y2, m2, 0);day2 = day2.getDate();if(d2 > day2){d2 = day2;}if(m2 < 10){m2 = '0' + m2;}return y2 + '-' + m2 + '-' + d2;
}
my_date('2018-12-20');  // "2019-01-20"
复制代码

参考资料

1.MDN 数字和日期
2. JS日期Date详解与实例扩展


本部分内容到这结束

Author 王平安
E-mail pingan8787@qq.com
博 客 www.pingan8787.com
微 信 pingan8787
每日文章推荐 github.com/pingan8787/…
JS小册 js.pingan8787.com

欢迎关注我的微信公众号【前端自习课】

【重温基础】7.时间对象相关推荐

  1. VBS基础篇 - wscript 对象

    VBS基础篇 - wscript 对象 一.wscript对象 描述:提供对 Windows 脚本宿主对象模型根对象的访问. 详述:WScript 对象是 Windows 脚本宿主对象模型层次结构的根 ...

  2. 【重温基础】2.流程控制和错误处理

    本文是 重温基础 系列文章的第二篇,需要让自己静下心来,学习,养成好习惯. 系列目录: [复习资料]ES6/ES7/ES8/ES9资料整理(个人整理) [重温基础]1.语法和数据类型 本章节复习的是J ...

  3. 批量生成数组_JavaScript【重温基础】13.迭代器和生成器

    本文是 重温基础 系列文章的第十三篇. 今日感受:每次自我年终总结,都会有各种情绪和收获. 本章节复习的是JS中的迭代器和生成器,常常用来处理集合. 前置知识: JavaScrip已经提供多个迭代集合 ...

  4. 【重温基础】6.数字

    本文是 重温基础 系列文章的第六篇. 今日感受:自己需要多总结,会有不同收获(比如今晚我做的转正总结). 系列目录: [复习资料]ES6/ES7/ES8/ES9资料整理(个人整理) [重温基础]1.语 ...

  5. [基础] AHK函数对象初窥 ① _实例2_实际可用版

    [基础] AHK函数对象初窥 ① _实例2_实际可用版 ;# 母文章 https://zhuanlan.zhihu.com/p/48977298;;;;;;;;;;;;;;;;;;;;;;;;;;;; ...

  6. 【JavaScript】查询字符串、JSON字符串、时间对象、定时器、同步异步、BOM

    文章目录 一.查询字符串 案例一:把查询字符串转为对象类型 案例二:把 对象转为查询字符串 二.JSON字符串 案例一:把 json格式转为 js格式 案例二:把 js格式 转为 json 格式字符串 ...

  7. R语言使用lubridate包的tz函数设置和查询日期、时间对象的时区信息( time zone)

    R语言使用lubridate包的tz函数设置和查询日期.时间对象的时区信息( time zone) 目录

  8. js php 获取时间倒计时_,js实现倒计时及时间对象

    JS实现倒计时效果代码如下: 无标题文档h #box { width: 100%; height: 400px; background: black; color: #fff; font-size:4 ...

  9. JavaScript – 6.JS面向对象基础(*) + 7.Array对象 + 8.JS中的Dictionary + 9.数组、for及其他...

    6.JS面向对象基础(*) 7.Array对象 7.1 练习:求一个数组中的最大值.定义成函数. 7.2 练习:将一个字符串数组输出为|分割的形式,比如"刘在石|金钟国|李光洙|HAHA|宋 ...

最新文章

  1. 什么?终止一个容器竟然用了 10 秒钟,这不能忍!
  2. tensorflow只用CPU运行
  3. windows10mysql安装包_windows10上安装mysql8(zip包)
  4. vue.js 三种方式安装--npm安装
  5. 基于FPGrowth挖掘算法的乳腺癌中医症型关联规则挖掘
  6. 关于Angular directive使用的语法问题
  7. 连续内存分区式内存管理
  8. 微服务流控防护场景与应对措施
  9. mysql查询和缓存原理
  10. 老实说,WPF对自由开发者与小微型团体来说就是个毒瘤!
  11. java解析魔兽争霸3录像_Java解析魔兽争霸3录像W3G文件(三):解析游戏开始前的信息...
  12. 激活函数(激励函数)理解总结
  13. 计算机技术和通信技术的关系,计算机技术与通信技术的关系
  14. 常用英语前缀和全部英语前缀——138个
  15. 新城易居程伟健:民宿集群,正在走向产业标准化的趋势!
  16. 前端开发入门到实战:纯CSS实现数据上报和HTML验证
  17. 制作带边框的圆形头像
  18. 电脑蓝屏显示(你的电脑遇到问题,需要重新启动,你可以重新启动)
  19. T51:字符流中第一个未重复的字符(Java)
  20. 装修鸿蒙瓷砖选择,装修用全抛釉瓷砖好还是通体大理石好?两种瓷砖有什么区别?...

热门文章

  1. 对map集合进行排序
  2. 词袋模型BoW图像检索Python实战
  3. 使用ListView实现汽泡短信聊天
  4. 神经网络 Stanford UFLDL
  5. turbo c图形方式下编程小技巧
  6. 带参数二维码如何跟踪用户来自哪个推广人员?
  7. 二维数组 \n是换行 三目运算符 if语句示例
  8. 2019年前端的3个趋势
  9. [Android] 给图像加入相框、圆形圆角显示图片、图像合成知识
  10. poj Buy Tickets