解析JS在获取当前月的最后一天遇到的坑


Posted in Javascript onAugust 30, 2019

为了更好的讲这节的内容,提示一个 JS 处理日期的小技巧,想获取上个月最后一天,只需要设置SetDate参数为0即可。

var endDate = new Date();
//上个月最后一天
endDate.setDate(0);

接着正文开始:

使用 JS 获取当前月的最后一天,咱们通常的思路先获取下个月的第一天,然后在减去一天,就是当前月的最后一天,所以自然会用到下面的代码:

var date= new Date();
date.setMonth(date.getMonth() + 1);
//日期设置为0号, 0表示1号的前一天
let lastDay = date.setDate(0);
console.log('最后一天:' + new Date(lastDay).toLocaleString())

我写此文的日期是2019.08.21,所以打印结果如下:

最后一天:2019/8/31 下午4:10:43

那这样的算法有没有bug,咱们并不确定,所以为了还原现场,现在咱们从2019.01.31一个一个来试试

var date= new Date(2019, 0, 31); //0 表示1月
date.setMonth(date.getMonth() + 1);
// 日期设置为0号, 0表示1号的前一天
let lastDay = date.setDate(0);
console.log('最后一天:' + new Date(lastDay).toLocaleString())

打印:

最后一天:2019/2/28 上午12:00:00

咱们可以看到,我们把 1月31号往后拨一个月在往前减一天,理应得到的是 1月31号,实际得到的是 2月28号,所以咱们写的代码是有bug的。

这又是怎么肥事?

咱们可以列出月份:

1月 1 ....... 28 29 30 31
2月 1 ....... 28
3月 1 ....... 28 29 30 31

咱们通过 month + 1,在 JS 中会理解成:

当前日期 + 当月的天数

所以上例中的 date.setMonth(date.getMonth() + 1) 等价于 1月31号 + 31天 ,根据上面的列表,就可以看到结果是3月3号

解析JS在获取当前月的最后一天遇到的坑

所以不要认为 month + 1 就是月份加 1,它的意思是当前日期加上当月天数 。

那要怎么保证多了不会多跳一个月呢?

只要保证 month + 1 之前不会超过28号就行啦,那要怎么做到呢?

推算:

  • 31号 + 31 会超
  • 30号 + 31 会超
  • 29号 + 31 会超
  • 28号 + 31 还是 28 号 刚好

所以秘诀在把31号回拨到28号就行啦,所以多加以下这句话就行了:

date.setDate(28)

完整代码:

var date= new Date(2019, 0, 31); //0 表示1月
date.setDate(28)
date.setMonth(date.getMonth() + 1);
// 日期设置为0号, 0表示1号的前一天
let lastDay = date.setDate(0);
console.log('最后一天:' + new Date(lastDay).toLocaleString())

运行结果:

最后一天:2019/1/31 上午12:00:00

代码部署后可能存在的BUG没法实时知道,事后为了解决这些BUG,花了大量的时间进行log 调试,这边顺便给大家推荐一个好用的BUG监控工具Fundebug。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
无语,javascript居然支持中文(unicode)编程!
Apr 12 Javascript
JS 日期验证正则附asp日期格式化函数
Sep 11 Javascript
jQuery插件原来如此简单 jQuery插件的机制及实战
Feb 07 Javascript
js+css实现tab菜单切换效果的方法
Jan 20 Javascript
浅谈关于JavaScript API设计的一些建议和准则
Jun 24 Javascript
AngularJS ng-change 指令的详解及简单实例
Jul 30 Javascript
js实现hashtable的赋值、取值、遍历操作实例详解
Dec 25 Javascript
js的函数的按值传递参数(实例讲解)
Nov 16 Javascript
Vue实现移动端页面切换效果【推荐】
Nov 13 Javascript
微信小程序使用Vant Weapp组件库的方法步骤
Aug 01 Javascript
JavaScript进阶(一)变量声明提升实例分析
May 09 Javascript
javascript实现点击产生随机图形
Jan 25 Javascript
Vue函数式组件的应用实例详解
Aug 30 #Javascript
详解elementui之el-image-viewer(图片查看器)
Aug 30 #Javascript
vue+koa2实现session、token登陆状态验证的示例
Aug 30 #Javascript
js利用递归与promise 按顺序请求数据的方法
Aug 30 #Javascript
Vue-CLI 项目在pycharm中配置方法
Aug 30 #Javascript
JS实现页面跳转与刷新的方法汇总
Aug 30 #Javascript
Vue 动态组件components和v-once指令的实现
Aug 30 #Javascript
You might like
PHP合并两个数组的两种方式的异同
2012/09/14 PHP
phpMyAdmin安装并配置允许空密码登录
2015/07/04 PHP
详解WordPress中给链接添加查询字符串的方法
2015/12/18 PHP
大家都应该掌握的PHP关联数组使用技巧
2015/12/25 PHP
PHP使用preg_split()分割特殊字符(元字符等)的方法分析
2017/02/04 PHP
php多进程应用场景实例详解
2019/07/22 PHP
Javascript 汉字字节判断
2009/08/01 Javascript
基于JQuery的一个简单的鼠标跟随提示效果
2010/09/23 Javascript
用于节点操作的API,颠覆原生操作HTML DOM节点的API
2010/12/11 Javascript
主页面中的两个iframe实现鼠标拖动改变其大小
2013/04/16 Javascript
Extjs中ComboBoxTree实现的下拉框树效果(自写)
2013/05/28 Javascript
可插入图片的TEXT文本框
2013/12/27 Javascript
javascript得到当前页的来路即前一页地址的方法
2014/02/18 Javascript
BootStrap table使用方法分析
2016/11/08 Javascript
如何理解Vue的v-model指令的使用方法
2018/07/19 Javascript
CSS3 动画卡顿性能优化的完美解决方案
2018/09/20 Javascript
微信小程序入口场景的问题集合与相关解决方法
2019/06/26 Javascript
Vue发布项目实例讲解
2019/07/17 Javascript
JS实现判断移动端PC端功能
2020/02/21 Javascript
vue项目启动出现cannot GET /服务错误的解决方法
2020/04/26 Javascript
JQuery省市联动效果实现过程详解
2020/05/08 jQuery
微信小程序实现多选框功能的实例代码
2020/06/24 Javascript
在Python中使用cookielib和urllib2配合PyQuery抓取网页信息
2015/04/25 Python
Python中函数的参数传递与可变长参数介绍
2015/06/30 Python
python3实现TCP协议的简单服务器和客户端案例(分享)
2017/06/14 Python
Python实现简单的HttpServer服务器示例
2017/09/25 Python
Ubuntu下使用Python实现游戏制作中的切分图片功能
2018/03/30 Python
Pytorch 实现数据集自定义读取
2020/01/18 Python
Python列表推导式实现代码实例
2020/09/09 Python
python 实现数据库中数据添加、查询与更新的示例代码
2020/12/07 Python
Fnac西班牙官网:法国文化和电子产品零售商
2021/03/14 全球购物
乡镇总工会学雷锋活动总结
2014/03/01 职场文书
办公室行政主管岗位职责
2015/04/09 职场文书
上学路上观后感
2015/06/16 职场文书
go类型转换及与C的类型转换方式
2021/05/05 Golang
星际争霸:毕姥爷vs解冻03
2022/04/01 星际争霸