深入理解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 相关文章推荐
理清apply(),call()的区别和关系
Aug 14 Javascript
js中的前绑定和后绑定详解
Aug 01 Javascript
JavaScript实现更改网页背景与字体颜色的方法
Feb 02 Javascript
js滚动条平滑移动示例代码
Mar 29 Javascript
jQuery基于$.ajax设置移动端click超时处理方法
May 14 Javascript
jQuery延迟执行的实现方法
Dec 21 Javascript
vue.js声明式渲染和条件与循环基础知识
Jul 31 Javascript
解决jquery的ajax调取后端数据成功却渲染失败的问题
Aug 08 jQuery
jQuery实现的老虎机跑动效果示例
Dec 29 jQuery
微信小程序实现人脸识别登陆的示例代码
Apr 02 Javascript
vue-week-picker实现支持按周切换的日历
Jun 26 Javascript
详解webpack的clean-webpack-plugin插件报错
Oct 16 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数据库密码的找回的步骤
2011/01/12 PHP
php获取mysql数据库中的所有表名的代码
2011/04/23 PHP
php生成静态文件的多种方法分享
2012/07/17 PHP
php set_time_limit()函数的使用详解
2013/06/05 PHP
php用户注册时常用的检验函数实例总结
2014/12/22 PHP
非常实用的php验证码类
2016/05/15 PHP
thinkPHP框架实现多表查询的方法
2018/06/14 PHP
大家未必知道的Js技巧收藏
2008/04/07 Javascript
20个非常棒的Jquery实用工具 国外文章
2010/01/01 Javascript
javascript的函数、创建对象、封装、属性和方法、继承
2011/03/10 Javascript
根据选择不同的下拉值出现相对应的文本输入框
2013/08/01 Javascript
网页下载文件期间如何防止用户对网页进行其他操作
2014/06/27 Javascript
js获取微信版本号的方法
2015/05/12 Javascript
JavaScript实现的伸展收缩型菜单代码
2015/10/14 Javascript
如何在Linux上安装Node.js
2016/04/01 Javascript
JS集成fckeditor及判断内容是否为空的方法
2016/05/27 Javascript
浅析Bootstrap验证控件的使用
2016/06/23 Javascript
jQuery实现的简单百分比进度条效果示例
2016/08/01 Javascript
Vue.js实现微信过渡动画左右切换效果
2017/06/13 Javascript
easyui下拉框动态级联加载的示例代码
2017/11/29 Javascript
vue-cli项目根据线上环境分别打出测试包和生产包
2018/05/23 Javascript
JavaScript实现多态和继承的封装操作示例
2018/08/20 Javascript
vue实现双向绑定和依赖收集遇到的坑
2018/11/29 Javascript
详解Jest结合Vue-test-utils使用的初步实践
2019/06/27 Javascript
node.js如何根据URL返回指定的图片详解
2020/10/21 Javascript
python嵌套函数使用外部函数变量的方法(Python2和Python3)
2016/01/31 Python
python中使用正则表达式的连接符示例代码
2017/10/10 Python
python验证码识别实例代码
2018/02/03 Python
使用python实现简单五子棋游戏
2019/06/18 Python
在PyTorch中Tensor的查找和筛选例子
2019/08/18 Python
如何用border-image实现文字气泡边框的示例代码
2020/01/21 HTML / CSS
美国女孩服装购物网站:Justice
2017/03/04 全球购物
波兰化妆品和护肤品购物网站:eKobieca
2019/08/30 全球购物
纬创Java面试题笔试题
2014/10/02 面试题
新郎婚宴答谢词
2014/01/19 职场文书
上市公司财务总监岗位职责
2015/04/03 职场文书