深入理解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 相关文章推荐
jQuery中校验时间格式的正则表达式小结
Sep 22 Javascript
扩展jQuery对象时如何扩展成员变量具体怎么实现
Apr 25 Javascript
JQuery实现展开关闭层的方法
Feb 17 Javascript
JS实现自动变换的菜单效果代码
Sep 09 Javascript
JavaScript黑洞数字之运算路线查找算法(递归算法)实例
Jan 28 Javascript
利用原生JS自动生成文章标题树的实例
Aug 22 Javascript
使用JavaScript判断用户输入的是否为正整数(两种方法)
Feb 05 Javascript
jQuery插件FusionCharts绘制的2D帕累托图效果示例【附demo源码】
Mar 28 jQuery
AngularJS实现controller控制器间共享数据的方法示例
Oct 30 Javascript
layer设置maxWidth及maxHeight解决方案
Jul 26 Javascript
JavaScript实现左右滚动电影画布
Feb 06 Javascript
JavaScript实时更新当前的时间的示例代码
Jul 15 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 无限分类的树类代码
2009/12/03 PHP
PHP学习笔记之一
2011/01/17 PHP
php使用substr()和strpos()联合查找字符串中某一特定字符的方法
2015/05/12 PHP
PHP与Web页面的交互示例详解一
2020/08/04 PHP
js中escape对应的C#解码函数 UrlDecode
2012/12/16 Javascript
将input file的选择的文件清空的两种解决方案
2013/10/21 Javascript
自己用jQuery写了一个图片的马赛克消失效果
2014/05/04 Javascript
jQuery实现字符串按指定长度加入特定内容的方法
2015/03/11 Javascript
简介JavaScript中的push()方法的使用
2015/06/09 Javascript
WEB前端开发都应知道的jquery小技巧及jquery三个简写
2015/11/15 Javascript
ES6中非常实用的新特性介绍
2016/03/10 Javascript
nodejs加密Crypto的实例代码
2016/07/07 NodeJs
mocha的时序规则讲解
2019/02/16 Javascript
微信小程序开发技巧汇总
2019/07/15 Javascript
浅谈python numpy中nonzero()的用法
2018/04/02 Python
python实现梯度下降算法
2020/03/24 Python
np.newaxis 实现为 numpy.ndarray(多维数组)增加一个轴
2019/11/30 Python
基于FME使用Python过程图解
2020/05/13 Python
Spring @Enable模块驱动原理及使用实例
2020/06/23 Python
HTML5进度条特效
2014/12/18 HTML / CSS
Html5+JS实现手机摇一摇功能
2015/04/24 HTML / CSS
html5自定义video标签的海报与播放按钮功能
2019/12/04 HTML / CSS
加拿大女鞋品牌:ALDO
2016/11/13 全球购物
全球烹饪课程的领先预订平台:Cookly
2020/01/28 全球购物
C语言笔试题回忆
2015/04/02 面试题
Prototype是怎么扩展DOM的
2014/10/01 面试题
资产评估专业学生的自我鉴定
2013/11/14 职场文书
毕业生自荐书
2014/02/02 职场文书
《中彩那天》教学反思
2014/02/22 职场文书
经济国贸专业求职信
2014/06/18 职场文书
房地产资料员岗位职责
2014/07/02 职场文书
党员干部观看《周恩来四个昼夜》思想汇报
2014/09/10 职场文书
网络管理员岗位职责
2015/02/12 职场文书
百家讲坛观后感
2015/06/12 职场文书
话题作文之关于呼唤
2019/11/29 职场文书
深入讲解数据库中Decimal类型的使用以及实现方法
2022/02/15 MySQL