解析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 removeChild 使用注意事项
Apr 11 Javascript
HTML5之WebSocket入门3 -通信模型socket.io
Aug 21 Javascript
jquery图片轮播特效代码分享
Apr 20 Javascript
Bootstrap简单表单显示学习笔记
Nov 15 Javascript
利用vue-router实现二级菜单内容转换
Nov 30 Javascript
vue动态绑定组件子父组件多表单验证功能的实现代码
May 14 Javascript
详解promise.then,process.nextTick, setTimeout 以及 setImmediate的执行顺序
Nov 21 Javascript
基于vue.js实现分页查询功能
Dec 29 Javascript
vue组件定义,全局、局部组件,配合模板及动态组件功能示例
Mar 19 Javascript
element-ui表格合并span-method的实现方法
May 21 Javascript
layui插件表单验证提交触发提交的例子
Sep 09 Javascript
taro 实现购物车逻辑的实例代码
Jun 05 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从memcache读取数据再批量写入mysql的方法
2014/12/29 PHP
PHP实现的AES 128位加密算法示例
2019/09/16 PHP
php数组和链表的区别总结
2019/09/20 PHP
setTimeout和setInterval的浏览器兼容性分析
2007/02/27 Javascript
求得div 下 img的src地址的js代码
2007/02/28 Javascript
让GoogleCode的SVN下的HTML文件在FireFox下正常显示.
2009/05/25 Javascript
Jquery ajaxsubmit上传图片实现代码
2010/11/04 Javascript
jQuery总体架构的理解分析
2011/03/07 Javascript
把jQuery的类、插件封装成seajs的模块的方法
2014/03/12 Javascript
jQuery学习总结之jQuery事件
2014/06/30 Javascript
JavaScript事件委托用法分析
2015/01/24 Javascript
逻辑表达式中与或非的用法详解
2016/06/06 Javascript
checkbox批量选中,获取选中项的值的简单实例
2016/06/28 Javascript
jQuery实现的右下角广告窗体跟随效果示例
2016/09/16 Javascript
Vue2.0实现购物车功能
2017/06/05 Javascript
vue项目部署上线遇到的问题及解决方法
2018/06/10 Javascript
Angular实现svg和png图片下载实现
2019/05/05 Javascript
Vue CL3 配置路径别名详解
2019/05/30 Javascript
vue 解决数组赋值无法渲染在页面的问题
2019/10/28 Javascript
vue实现跳转接口push 转场动画示例
2019/11/01 Javascript
[01:04:20]完美世界DOTA2联赛PWL S2 LBZS vs Forest 第一场 11.29
2020/12/02 DOTA
最近Python有点火? 给你7个学习它的理由!
2017/06/26 Python
Python实现简单的用户交互方法详解
2018/09/25 Python
python 2.7 检测一个网页是否能正常访问的方法
2018/12/26 Python
linux查找当前python解释器的位置方法
2019/02/20 Python
Pandas之Fillna填充缺失数据的方法
2019/06/25 Python
Python re 模块findall() 函数返回值展现方式解析
2019/08/09 Python
在tensorflow中设置使用某一块GPU、多GPU、CPU的操作
2020/02/07 Python
美国折扣地毯销售网站:Rugs.com
2020/03/27 全球购物
信息管理员岗位职责
2013/12/01 职场文书
爸爸的花儿落了教学反思
2014/02/20 职场文书
物联网工程专业推荐信
2014/09/08 职场文书
民事诉讼代理授权委托书
2014/10/11 职场文书
2015年国庆节标语大全
2015/07/30 职场文书
分享:关于学习的励志名言赏析
2019/08/16 职场文书
业余无线电通联Q语
2022/02/18 无线电