深入理解javascript的getTime()方法


Posted in Javascript onFebruary 16, 2017

1、理解getTime

getTime() 方法返回一个时间的格林威治时间数值。

可以使用这个方法把一个日期时间赋值给另一个Date 对象。

语法:

dateObj.getTime()
参数:

无。

返回值:

getTime 方法的返回值一个数值,表示从1970年1月1日0时0分0秒(UTC,即协调世界时)距离该日期对象所代表时间的毫秒数。

例子:

使用 getTime() 复制日期对象

创建一个拥有相同时间值的日期对象。

var birthday = new Date(1994, 12, 10);
var copy = new Date();
copy.setTime(birthday.getTime());

测试结果如下:

深入理解javascript的getTime()方法

    既然表示从1970年1月1日开始计算的毫秒数,如果小于1970年呢,会是什么情况?(测试结果如下,是负数)

深入理解javascript的getTime()方法

2、应用场景

2.1 测量代码执行时间

连续调用两个新生成的日期对象的 getTime 方法,根据两次调用的返回值求得时间差。这可以用于计算某些操作的执行时间。

var end, start, i;
start = new Date();
for (i = 0; i < 100000; i++) {
 Math.sqrt(i);
}
end = new Date();

console.log("Operation took " + (end.getTime() - start.getTime()) + " msec");

在chrome浏览器中进行测试:

深入理解javascript的getTime()方法

2.2 甘特图时间表示

最近在调整teamwork gantt中,发现,是一个task任务项的开始时间与结束时间,都是用一个整数表示,而该数值就是UTC表示法。格式如下:

{"tasks":[
   {"id":-1,"name":"Gantt editor","code":"","level":0,"status":"STATUS_ACTIVE","canWrite":true,"start":1396994400000,"duration":21,"end":1399672799999,"startIsMilestone":true,"endIsMilestone":false,"collapsed":false,"assigs":[],"hasChild":true}
   ,{"id":-2,"name":"coding","code":"","level":1,"status":"STATUS_ACTIVE","canWrite":true,"start":1396994400000,"duration":10,"end":1398203999999,"startIsMilestone":false,"endIsMilestone":false,"collapsed":false,"assigs":[],"description":"","progress":0,"hasChild":true}
   ,{"id":-3,"name":"gantt part","code":"","level":2,"status":"STATUS_ACTIVE","canWrite":true,"start":1396994400000,"duration":2,"end":1397167199999,"startIsMilestone":false,"endIsMilestone":false,"collapsed":false,"assigs":[],"depends":"","hasChild":false}
   ,{"id":-4,"name":"editor part","code":"","level":2,"status":"STATUS_SUSPENDED","canWrite":true,"start":1397167200000,"duration":4,"end":1397685599999,"startIsMilestone":false,"endIsMilestone":false,"collapsed":false,"assigs":[],"depends":"","hasChild":false}
   ,{"id":-5,"name":"testing","code":"","level":1,"status":"STATUS_SUSPENDED","canWrite":true,"start":1398981600000,"duration":6,"end":1399672799999,"startIsMilestone":false,"endIsMilestone":false,"collapsed":false,"assigs":[],"depends":"","description":"","progress":0,"hasChild":true}
   ,{"id":-6,"name":"test on safari","code":"","level":2,"status":"STATUS_SUSPENDED","canWrite":true,"start":1398981600000,"duration":2,"end":1399327199999,"startIsMilestone":false,"endIsMilestone":false,"collapsed":false,"assigs":[],"depends":"8SF:11","hasChild":false}
   ,{"id":-7,"name":"test on safari","code":"","level":2,"status":"STATUS_SUSPENDED","canWrite":true,"start":1398981600000,"duration":2,"end":1399327199999,"startIsMilestone":false,"endIsMilestone":false,"collapsed":false,"assigs":[],"depends":"8SF","hasChild":false}
   ,{"id":-8,"name":"test on ie","code":"","level":2,"status":"STATUS_SUSPENDED","canWrite":true,"start":1400688000000,"duration":3,"end":1400947199999,"startIsMilestone":false,"endIsMilestone":false,"collapsed":false,"assigs":[],"depends":"","hasChild":false}
   ,{"id":-9,"name":"test on chrome","code":"","level":2,"status":"STATUS_SUSPENDED","canWrite":true,"start":1399327200000,"duration":2,"end":1399499999999,"startIsMilestone":false,"endIsMilestone":false,"collapsed":false,"assigs":[],"links":"","hasChild":false}
   ,{"id":-10,"name":"Gantt editor","code":"","level":0,"status":"STATUS_ACTIVE","canWrite":true,"start":1396994400000,"duration":21,"end":1399672799999,"startIsMilestone":true,"endIsMilestone":false,"collapsed":false,"assigs":[],"hasChild":true}
   ,{"id":-11,"name":"coding","code":"","level":1,"status":"STATUS_ACTIVE","canWrite":true,"start":1396994400000,"duration":10,"end":1398203999999,"startIsMilestone":false,"endIsMilestone":false,"collapsed":false,"assigs":[],"description":"","progress":0,"hasChild":true}
   ,{"id":-12,"name":"gantt part","code":"","level":2,"status":"STATUS_ACTIVE","canWrite":true,"start":1396994400000,"duration":2,"end":1397167199999,"startIsMilestone":false,"endIsMilestone":false,"collapsed":false,"assigs":[],"depends":"","hasChild":false}
   ,{"id":-14,"name":"editor part","code":"","level":2,"status":"STATUS_SUSPENDED","canWrite":true,"start":1397167200000,"duration":4,"end":1397685599999,"startIsMilestone":false,"endIsMilestone":false,"collapsed":false,"assigs":[],"depends":"","hasChild":false}
   ,{"id":-15,"name":"testing","code":"","level":1,"status":"STATUS_SUSPENDED","canWrite":true,"start":1398981600000,"duration":6,"end":1399672799999,"startIsMilestone":false,"endIsMilestone":false,"collapsed":false,"assigs":[],"depends":"","description":"","progress":0,"hasChild":true}
   ,{"id":-16,"name":"test on safari","code":"","level":2,"status":"STATUS_SUSPENDED","canWrite":true,"start":1398981600000,"duration":2,"end":1399327199999,"startIsMilestone":false,"endIsMilestone":false,"collapsed":false,"assigs":[],"depends":"","hasChild":false}
   ,{"id":-17,"name":"test on ie","code":"","level":2,"status":"STATUS_SUSPENDED","canWrite":true,"start":1399327200000,"duration":3,"end":1399586399999,"startIsMilestone":false,"endIsMilestone":false,"collapsed":false,"assigs":[],"depends":"","hasChild":false}
   ,{"id":-18,"name":"test on chrome","code":"","level":2,"status":"STATUS_SUSPENDED","canWrite":true,"start":1399327200000,"duration":2,"end":1399499999999,"startIsMilestone":false,"endIsMilestone":false,"collapsed":false,"assigs":[],"depends":"","hasChild":false}
   ],"selectedRow":0,"canWrite":true,"canWriteOnParent":true}

在甘特图中,使用getTime表示时间有以下优势:

计算两个时间差比较方便
数据存储结构比较简单
由于gantt涉及到画图,使用整型数据方便处理

3、浏览器的兼容性

使用js要收到浏览器的限制,不同浏览器对js类库的支持强弱也不同。而作为标准类库Date的一个方法,其适应的浏览器如下:

深入理解javascript的getTime()方法

深入理解javascript的getTime()方法

4、参考资料

Date.prototype.getTime():https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Date/getTime

Javascript 相关文章推荐
Javascript中arguments和arguments.callee的区别浅析
Apr 24 Javascript
Jquery解析json字符串及json数组的方法
May 29 Javascript
jQuery实现表单步骤流程导航代码分享
Aug 28 Javascript
javascript每日必学之封装
Feb 23 Javascript
javascript中FOREACH数组方法使用示例
Mar 01 Javascript
jQuery DataTables插件自定义Ajax分页实例解析
Apr 28 Javascript
layui.js实现的表单验证功能示例
Nov 15 Javascript
详解React项目的服务端渲染改造(koa2+webpack3.11)
Mar 19 Javascript
jQuery实现的点击标题文字切换字体效果示例【测试可用】
Apr 26 jQuery
详解webpack loader和plugin编写
Oct 12 Javascript
vue使用el-upload上传文件及Feign服务间传递文件的方法
Mar 15 Javascript
React Hook用法示例详解(6个常见hook)
Apr 28 Javascript
js实现兼容PC端和移动端滑块拖动选择数字效果
Feb 16 #Javascript
js时间戳格式化成日期格式的多种方法介绍
Feb 16 #Javascript
基于JavaScript实现拖动滑块效果
Feb 16 #Javascript
js实现移动端微信页面禁止字体放大
Feb 16 #Javascript
100多个基础常用JS函数和语法集合大全
Feb 16 #Javascript
js实现tab切换效果
Feb 16 #Javascript
jquery实现自适应banner焦点图
Feb 16 #Javascript
You might like
php实现倒计时效果
2015/12/19 PHP
php变量与数组相互转换的方法(extract与compact)
2016/12/02 PHP
Javascript miscellanea -display data real time, using window.status
2007/01/09 Javascript
js网页侧边随页面滚动广告效果实现
2011/04/14 Javascript
Jquery工作常用实例 使用AJAX使网页进行异步更新
2011/07/26 Javascript
Bootstrap编写一个兼容主流浏览器的受众门户式风格页面
2016/07/01 Javascript
jQuery实现限制文本框的输入长度
2017/01/11 Javascript
nodejs实现发出蜂鸣声音(系统报警声)的方法
2017/01/18 NodeJs
理解 Node.js 事件驱动机制的原理
2017/08/16 Javascript
JS对象与json字符串相互转换实现方法示例
2018/06/14 Javascript
解决angularjs前后端分离调用接口传递中文时中文乱码的问题
2018/08/13 Javascript
一次Webpack配置文件的分离实战记录
2018/11/30 Javascript
通过实例讲解JS如何防抖动
2019/06/15 Javascript
layer.open提交子页面的form和layedit文本编辑内容的方法
2019/09/27 Javascript
vue视频播放暂停代码
2019/11/08 Javascript
vue把输入框的内容添加到页面的实例讲解
2019/11/11 Javascript
详解JavaScript修改注册表的方法
2020/01/05 Javascript
JavaScript设计模型Iterator实例解析
2020/01/22 Javascript
Linux下使用python自动修改本机网关代码分享
2015/05/21 Python
基于python的多进程共享变量正确打开方式
2018/04/28 Python
详解Python 解压缩文件
2019/04/09 Python
python实现微信每日一句自动发送给喜欢的人
2019/04/29 Python
Pycharm使用远程linux服务器conda/python环境在本地运行的方法(图解))
2019/12/09 Python
Python Web项目Cherrypy使用方法镜像
2020/11/05 Python
纯CSS3制作漂亮带动画效果的主机价格表
2015/04/25 HTML / CSS
美国最大的团购网站:Groupon
2016/07/23 全球购物
软件测试笔试题
2012/10/25 面试题
药学专业大专生的自我评价
2013/12/12 职场文书
城管综合整治方案
2014/05/01 职场文书
员工薪酬激励方案
2014/06/13 职场文书
雷人标语集锦
2014/06/19 职场文书
2015年环境监察工作总结
2015/07/23 职场文书
导游词之新疆-喀纳斯
2019/10/10 职场文书
话题作文之呼唤
2019/12/18 职场文书
Jedis操作Redis实现模拟验证码发送功能
2021/09/25 Redis
 Python 中 logging 模块使用详情
2022/03/03 Python