深入理解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中文入门指南,翻译加实例,jQuery的起点教程
Jan 13 Javascript
JS实现的在线调色板实例(附demo源码下载)
Mar 01 Javascript
javascript html5移动端轻松实现文件上传
Mar 27 Javascript
浅析JS动态创建元素【两种方法】
Apr 20 Javascript
图文详解Heap Sort堆排序算法及JavaScript的代码实现
May 04 Javascript
Bootstrap轮播插件中图片变形的终极解决方案 使用jqthumb.js
Jul 10 Javascript
超详细的JS弹出窗口代码大全
Apr 18 Javascript
详解如何在react中搭建d3力导向图
Jan 12 Javascript
解决淘宝cnpm 安装后cnpm不是内部或外部命令的问题
May 17 Javascript
如何解决vue2.0下IE浏览器白屏问题
Sep 13 Javascript
ajax请求前端跨域问题原因及解决方案
Oct 16 Javascript
关于Vue中的options选项
Mar 22 Vue.js
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/04/21 PHP
php中preg_match的isU代表什么意思
2015/10/01 PHP
使用PHP similar text计算两个字符串相似度
2015/11/06 PHP
php插入含有特殊符号数据的处理方法
2016/11/24 PHP
Thinkphp整合微信支付功能
2016/12/14 PHP
phpstudy默认不支持64位php的解决方法
2017/02/20 PHP
javascript写的一个链表实现代码
2009/10/25 Javascript
Jquery 动态添加按钮实现代码
2010/05/06 Javascript
Javascript 浮点运算的问题分析与解决方法
2013/08/27 Javascript
JS获取select的value和text值的简单实例
2014/02/26 Javascript
分享20个提升网站界面体验的jQuery插件
2014/12/15 Javascript
纯javascript移动优先的幻灯片效果
2015/11/02 Javascript
完美JQuery图片切换效果的简单实现
2016/07/21 Javascript
Three.js学习之Lamber材质和Phong材质
2016/08/04 Javascript
JS 拦截全局ajax请求实例解析
2016/11/29 Javascript
js实现简单的计算器功能
2017/01/16 Javascript
利用JS hash制作单页Web应用的方法详解
2017/10/10 Javascript
Node.js readline模块与util模块的使用
2018/03/01 Javascript
vue之浏览器存储方法封装实例
2018/03/15 Javascript
使用jquery模拟a标签的click事件无法实现跳转的解决
2018/12/04 jQuery
JavaScript动态检测密码强度原理及实现方法详解
2019/06/11 Javascript
微信小程序 函数防抖 解决重复点击消耗性能问题实现代码
2019/09/12 Javascript
vue之封装多个组件调用同一接口的案例
2020/08/11 Javascript
初学python的操作难点总结(新手必看篇)
2017/08/03 Python
Python判断两个对象相等的原理
2017/12/12 Python
Django objects的查询结果转化为json的三种方式的方法
2018/11/07 Python
Python数据可视化之画图
2019/01/15 Python
Django如何防止定时任务并发浅析
2019/05/14 Python
Python批量生成幻影坦克图片实例代码
2019/06/04 Python
让IE可以变相支持CSS3选择器
2010/01/21 HTML / CSS
aden + anais官方网站:婴儿襁褓、毯子、尿布和服装
2017/06/21 全球购物
介绍下Java的输入输出流
2014/01/22 面试题
机电一体化专业推荐信
2013/12/03 职场文书
2014年节能工作总结
2014/12/18 职场文书
宣传部部长竞选稿
2015/11/21 职场文书
用CSS3画一个爱心
2021/04/27 HTML / CSS