这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助

大家平时在开发的时候有没被new Date()折磨过?就是它的诸多怪异的设定让你每每用的时候,都可能不小心踩坑。造成程序意外出错,却一下子找不到问题出处,那叫一个烦透了…… 下面,我就列举它的“四宗罪”及应用思考

可恶的四宗罪

1. Safari浏览器不兼容YYYY-MM-DD这样的格式

new Date('2023-1-1');

这行代码无论在Macbook中还是iPhone中的Safari浏览器,返回的都是Invalid Date, Safari浏览器目前还理解不了YYYY-MM-DD这样的格式,只支持YYYY/MM/DD。这就造成你在Windows环境下的代码正常原型,而你的其他部分用户异常显示;

2、月份的索引是以0为起点的,而年份、日期却不是

new Date(2023,1,1);

得到的是一个反直觉的结果:2023年2月1日!!!

Wed Feb 01 2023 00:00:00 GMT+0800 (中国标准时间)

同样的,对应的方法.setMonth()也是从0开始设置的。就……很无语!

3、年份小于100,默认以19xx或20xx开头

一般的应用可能碰不到这样的情况,毕竟现在是21世纪了,我们在应用中看到的大部分时间都是现代的。但是当你需要格式化公元元年-公元100年之间的时间,你就该懵了!

举个栗子:

new Date(2023,1,1);

能正常返回时间对象

Wed Feb 01 2023 00:00:00 GMT+0800 (中国标准时间)

但是当年份调到了东汉时期,公元50年2月1日

new Date(50,2,1);

恭喜你,你直接迎接了新中国!见证了历史:

Wed Mar 01 1950 00:00:00 GMT+0800 (中国标准时间)

是的,Date直接帮你加了1900年的时间!如果需要获得公元50年2月1日,得这么写

new Date('0050-02-01');

返回:

Tue Feb 01 0050 08:05:43 GMT+0805 (中国标准时间)

请千万不要尝试添加时间,因为你又要裂开了……

new Date('0050-02-01 00:00:00');

返回:

Wed Feb 01 1950 00:00:00 GMT+0800 (中国标准时间)

你就说,它任性吧?!别气馁,别忘了标题还有20xx的情况

new Date('10-11-12');

返回:

Thu Oct 11 2012 00:00:00 GMT+0800 (中国标准时间)

就是说,当年份为2位数的时候,这种字符串格式的,构造函数把最后面那个当作年份,而且默认它为20xx年

4、日期初始化不统一,存在时区差异

你相信吗?'2018-01-01'和'2018/01/01'是不同的,存在一定时差

new Date('2018-01-01');

返回:

Mon Jan 01 2018 08:00:00 GMT+0800 (中国标准时间)

然而……

new Date('2018/01/01');

返回:

Mon Jan 01 2018 00:00:00 GMT+0800 (中国标准时间)

看到差异了吗?两种格式返回的时间是不同的,查了个北京时间与格林尼治时间的时差,8个小时啊!

应用思考

在日常开发中,我们应用new Date()无非就是对时间运算及时间的格式化。

1. 时间的计算

需要方便对比两个时间的早晚,可以分别对年份、月份、日期、小时等进行单独比较。而我们现有的操作还比较麻烦。

比如,我想知道2003年7月13日北京申奥成功到2008年8月8日北京奥运开幕中间差了几天,如何快速计算?这样的计算在日常开发中还比较常见,特别是电商网站对抢购环节的倒计时。

还有诸如,当前时间在100天以后又是几月几号呢?

2. 时间的比较

给定两个时间,判断哪个在前,哪个在后;给定一个时间返回,判断某个时间是不是在这两者之间。

3. 时间的格式化

在网站开发中,我们最常见的就是对后台返回时间戳的格式化显示。而原生带来的仅有年份如何获取,月份如何获取,日期如何获取的方法,就方便的无非就是toISOString()这样的方法,但是返回的却不一定是你要的格式。如何快速实现自定义格式化字符串,这也是一门技术。

困境的解决

想必大家日常中也用过 moment.js、dayjs、data-format这些工具吧?确实挺好用的,我也就顺便说一下而已。因为我要开始打广告了……面对着new Date()各种无语的坑,我慢慢的也弄了一个不大的库(250行左右代码)。

你要说我的库和前面的几个库对比,有啥改进的或者有啥特点的吗?

确实也没有,我只是想用自己造的“轮子”,走自己路。它更符合我自己的使用习惯罢了

【项目开源地址】github.com/mumuy/datex

【项目演示地址】passer-by.com/datex/

提供的方法足以解决以上“四宗罪”及日常应用。它提供多种初始化时间的方式:

实例化对象

// 通过时间戳
datex(123456789); // 通过多个参数初始化
datex(2018,8,8); // 通过时间字符串初始化
datex('2018-08-08');
datex('2018-04-04T16:00:00.000Z'); // 通过时间对象初始化
datex({year:2008,month:8,day:8,hour:8,minute:0,second:0}); // 通过时间数组初始化
datex([2018,8,8,8,8,0]); // 无参数初始化
datex();

时间戳及克隆

// 返回时间戳(毫秒)
datex().getTime(); // 返回时间戳(秒)
datex().getUnix(); // 克隆
datex().clone();

时间对象输出

// 返回原生Date对象
datex().toDate(); // 返回时间字段对象
datex().toObject(); // 返回时间字段数组
datex().toArray(); // 返回字符串
datex().toString(); // 返回ISO字符串
datex().toISOString();

时间格式化

datex(123456789).format('YYYY-MM-DD');

时间计算及比较

// 设置某字段值
datex(2022,10,1).set('year',2020).format(); // 增减某字段值,负值为减
datex(2022,10,1).change('year',1).format(); // 返回某字段值
datex().get('month'); // 获取某字段起始时
// 例如:获取这个月初是星期几?
datex().startOf('month').format('W'); // 获取某字段末尾时
// 例如:获取这个月有多少天?(是不是很容易理解?end of month then get day!)
datex().endOf('month').get('day'); // 与某时间点差值
// 例如:北京2008年奥运会开幕式过去多少天了?
datex().diffWith('2008-8-8','day'); // 是否在某个时间点之前
datex('2008-08-08').isBefore('2022-02-02'); // 是否在某个时间点之后
datex('2008-08-08').isAfter('2022-02-02'); // 是否和某个时间点相等
datex('2008-08-08').isSame('2018-02-02','year'); // 是否在两个时间点之间
datex('2008-08-08').isBetween('2003-07-13','2022-02-02');

有效性

datex('2008-13-12').isValid();

本文转载于:

https://juejin.cn/post/7221884988492382267

如果对您有所帮助,欢迎您点个关注,我会定时更新技术文档,大家一起讨论学习,一起进步。

记录-new Date() 我忍你很久了!的更多相关文章

  1. mysql 去除重复 Select中DISTINCT关键字的用法 在使用mysql时,有时需要查询出某个字段不重复的记录,虽然mysql提供 有distinct这个关键字来过滤掉多余的重复记录只保留一条,但往往只用它来返回不重复记录的条数,而不是用它来返回不重记录的所有值。其原因是 distinct只能返回它的目标字段,而无法返回其它字段,这个问题让我困扰了很久,用distinct不能解决的话,

      在使用mysql时,有时需要查询出某个字段不重复的记录,虽然mysql提供 有distinct这个关键字来过滤掉多余的重复记录只保留一条,但往往只用它来返回不重复记录的条数,而不是用它来返回不重记 ...

  2. 使用Fragment应用放置后台很久,被系统回收,出现crash

    使用Fragment应用放置后台很久,被系统回收,出现crash:原因:系统做了源码FragmentActivity调用onSaveInstanceState保存Fragment对象,这时候系统恢复保 ...

  3. 很久之前写的Ajax库

    很久之前写的一个小型AJAX的js,放在上面以免以后想玩了找不到了. // version : 0.1 beta // author : __Ajax function __Ajax(url,opti ...

  4. SVN模型仓库中的资源从一个地方移动到另一个地方的办法(很久才解决)

    弄了很久,想使用domove这个操作,但是都失败了.最后给svnkit的邮箱写了封邮件,他们告诉我这样做就成功了.实际上是使用docopy这个函数实现了move操作.package com.repos ...

  5. Yii2 关于yii\db\Connection::open耗时很久的问题(1000ms左右)

    关于这个问题我纠结了很久,每次打开网页yii\db\Connection::open几乎都耗时1000ms. 其实这个问题很好解决:只要把config\db.php配置信息里的localhost,改成 ...

  6. chrome浏览器上传图片反应很慢,延迟很久才弹出窗口

    chrome浏览器上传图片反应很慢,延迟很久才弹出窗口 一个上传图片的控件,点击按钮上传图片,用chrome(谷歌浏览器)时,点击按钮后,要等好几秒才弹出文件选择窗口 可以试一下,把网络断开,这个问题 ...

  7. 解决ssh连接慢,挂起在SSH2_MSG_SERVICE_ACCEPT信息之后很久的问题

    问题现象:无论是ssh 还是 scp 都会连接很久才提示输认证信息(注意:是连接慢) 如本机IP:192.168.18.208 (Hostname: ThinkPad) 目标主机:192.168.18 ...

  8. 页面白屏并且报错PHP Parse error: syntax error, unexpected end of file in 试了很久总算解决了

    页面白屏并且报错PHP Parse error:  syntax error, unexpected end of file in 试了很久 啥短标记,打开,都试了 最简单的办法 是重新建立一个文件, ...

  9. 【2020Java最新学习路线】写了很久,这是一份最适合普通大众、科班、非科班的路线

    点赞再看,养成习惯,微信搜索[三太子敖丙]关注这个互联网苟且偷生的工具人. 本文 GitHub https://github.com/JavaFamily 已收录,有一线大厂面试完整考点.资料以及我的 ...

  10. 【高并发】高并发环境下构建缓存服务需要注意哪些问题?我和阿里P9聊了很久!

    写在前面 周末,跟阿里的一个朋友(去年晋升为P9了)聊了很久,聊的内容几乎全是技术,当然了,两个技术男聊得最多的话题当然就是技术了.从基础到架构,从算法到AI,无所不谈.中间又穿插着不少天马行空的想象 ...

随机推荐

  1. 初次尝试GPU Driven —— 大范围植被渲染

    初次尝试GPU Driven -- 大范围植被渲染 GPU Driver简单概要,即把整体逻辑放到GPU上运行,解放CPU压榨GPU,初次尝试,记录一下研究过程. 渡神纪 塞尔达 塞尔达 塞尔达 在开 ...

  2. google三驾马车之一:Bigtable解读(英文版)

    本文重点关注了系统设计相关的内容,paper后半部分的具体应用此处没有过多涉及.从个人笔记修改而来,因此为英文版本. Bigtable: A Distributed Storage System fo ...

  3. Java集合篇之深入解析LinkedList

    写在开头 作为ArrayList的同门师兄弟,LinkedList的师门地位逊色不少,除了在做算法题的时候我们会用到它之外,在实际的开发工作中我们极少使用它,就连它的创造者都说:"I wro ...

  4. JS leetcode 存在重复元素 II 题解分析,记一次震惊的负向优化

    壹 ❀ 引 整理下今天做的算法题,题目难度不高,但在优化角度也是费了一些功夫.题目来自219. 存在重复元素 II,问题描述如下: 给定一个整数数组和一个整数 k,判断数组中是否存在两个不同的索引 i ...

  5. Laravel入坑指南(9)——数据迁移与填充

    当我们开发完成一个(小)项目,发布到线上时,我们需要将本地数据库迁移到服务器上,并且填充初始化数据.而Laravel框架规定了一套完善的数据迁移与填充机制. 在官网中分别介绍了以下四个命令: php ...

  6. 解密C语言选择结构:掌握条件语句与分支逻辑的利器

    欢迎大家来到贝蒂大讲堂 养成好习惯,先赞后看哦~ 所属专栏:C语言学习 贝蒂的主页:Betty's blog 引言 C语⾔是结构化的程序设计语⾔,这⾥的结构指的是顺序结构.选择结构.循环结构.为什么有 ...

  7. python-鼠标宏

    按下鼠标左键, 连击 按下鼠标右键, 停止 import win32api import time from pynput.mouse import Button, Controller mouse ...

  8. 【Android 逆向】【ARM汇编】 全局资源重定位

    资源重定位解释: 字符串反汇编代码解释: .rodata:00001E20 __exidx_end DCB "a + b = %d" ; DATA_XREF: main+28^o ...

  9. Qt+QtWebApp开发笔记(六):http服务器html实现静态相对路径调用第三方js文件

    前言   前面做了一些交互,网页是直接通过html对response进行返回的,这里QtWebApp与传统的web服务器不同,传统的web服务器可以调用同级目录相对路径或者绝对路径下的js,而QtWe ...

  10. python字典操作的大O效率