网站首页 > 博客文章 正文
Date是JS中用于处理日期时间的核心对象。熟悉Date对象,可以使我们的日期处理代码写的更优雅。现在,进入正题:如何更优雅的计算时间差?
最近,接手了一套前端祖传项目,是N年前一个C#工程师写的,里面有一个计算时差函数是这么写的:
/*************************************************
* 计算时差
*/
function calculateTimeSpan(begTime)
{
var date3=new Date().getTime()-begTime.getTime() ; //时间差的毫秒数
if(date3 <0) date3 = 0 ;
//计算出小时数
var leave1=date3%(24*3600*1000) ; //计算天数后剩余的毫秒数
var hours=Math.floor(leave1/(3600*1000));
//计算相差分钟数
var leave2=leave1%(3600*1000) ; //计算小时数后剩余的毫秒数
var minutes=Math.floor(leave2/(60*1000));
//计算相差秒数
var leave3=leave2%(60*1000); //计算分钟数后剩余的毫秒数
var seconds=Math.round(leave3/1000);
return hours+":"+minutes+":"+seconds ;
}
上面的函数,大家能看懂吗?是不是觉得理解起来很吃力?这个函数接收一个开始日期时间,计算距离当前日期时间的时间差,最后返回一个截掉年月日,以时分秒表示的时间字符串。
虽然Date对象有一个getTime方法,但实际上,我们永远都不需要使用它。为什么呢?因为有更好的方法替代它。
获取当前时间的时间戳,除了getTime,还有如下方式:
const ms = Date.now()
const ms = +new Date()
是不是都比getTime写的更少?实际上,日期之间的算术运算并不需要手动转化为时间戳数值,JS内部会进行临时自动类型转化,将Date对象转化为时间戳再进行运算。计算时间差,我们可以直接这么写:
const timeSpan = new Date() - begTime
上面的计算时差函数,我这里有一个更简洁且易于理解的解决方案。就是根据任意年月日创建一个日期对象,此时它的时分秒都是0。然后,我们调用它的setMilliseconds方法,将时差毫秒传入,最后返回以它的时分秒表示的字符串即可。代码如下:
/**
* 计算时差
* @param {Date} beginTime
*/
const calcTimeSpan = beginTime => {
const date = new Date(2000, 1, 1)
date.setMilliseconds(Math.max(new Date() - beginTime, 0))
return `${date.getHours()}:${date.getMinutes()}:${date.getSeconds()}`
}
仅需3行代码,我们便实现了与上面9行代码相同的功能,而且简洁很多。大家都能看懂吧?这个方案是不是很好理解?
若大家还有不明白的地方,欢迎评论区问我。感谢阅读!
猜你喜欢
- 2024-12-02 PHP时间戳的秘密--关于PHP时间戳函数各种使用方法
- 2024-12-02 MySQL 中时间函数详解,及加减计算总结和使用!
- 2024-12-02 SQLServer时间戳的误解,与时间没有关系
- 2024-12-02 一种整车域控制器片内及片外时间同步方法
- 2024-12-02 时间戳服务怎么收费?可信时间戳一年多少钱?
- 2024-12-02 PTP时间同步的具体原理
- 2024-12-02 特斯拉UWB数字钥匙,是怎么一步步被黑的
- 2024-12-02 项目多时区处理
- 2024-12-02 java的时间戳的长度为什么是固定的?它是如何做到的
- 2024-12-02 「技术分享」利用卫星校准系统时间
你 发表评论:
欢迎- 最近发表
- 标签列表
-
- powershellfor (55)
- messagesource (56)
- aspose.pdf破解版 (56)
- promise.race (63)
- 2019cad序列号和密钥激活码 (62)
- window.performance (66)
- qt删除文件夹 (72)
- mysqlcaching_sha2_password (64)
- ubuntu升级gcc (58)
- nacos启动失败 (64)
- ssh-add (70)
- jwt漏洞 (58)
- macos14下载 (58)
- yarnnode (62)
- abstractqueuedsynchronizer (64)
- source~/.bashrc没有那个文件或目录 (65)
- springboot整合activiti工作流 (70)
- jmeter插件下载 (61)
- 抓包分析 (60)
- idea创建mavenweb项目 (65)
- vue回到顶部 (57)
- qcombobox样式表 (68)
- vue数组concat (56)
- tomcatundertow (58)
- pastemac (61)
本文暂时没有评论,来添加一个吧(●'◡'●)