深入理解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 相关文章推荐
Zero Clipboard js+swf实现的复制功能使用方法
Mar 07 Javascript
如何用js 实现依赖注入的思想,后端框架思想搬到前端来
Aug 03 Javascript
jQuery操作Table技巧大汇总
Jan 23 Javascript
iScroll.js 使用方法参考
May 16 Javascript
浅谈JavaScript对象与继承
Jul 10 Javascript
Angular使用 ng-img-max 调整浏览器中的图片的示例代码
Aug 17 Javascript
javascript计算对象长度的方法
Oct 25 Javascript
js 索引下标之li集合绑定点击事件
Jan 12 Javascript
详解VUE 对element-ui中的ElTableColumn扩展
Mar 28 Javascript
Angular6中使用Swiper的方法示例
Jul 09 Javascript
vue获取data数据改变前后的值方法
Nov 07 Javascript
vue中父子组件的参数传递和应用示例
Jan 04 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抓取蜘蛛爬虫痕迹的示例代码
2016/09/30 PHP
PHP实现微信JS-SDK接口选择相册及拍照并上传的方法
2016/12/05 PHP
PHP实现通过CURL上传文件功能示例
2018/05/30 PHP
Laravel框架模型的创建及模型对数据操作示例
2019/05/07 PHP
Javascript学习笔记9 prototype封装继承
2010/01/11 Javascript
Javascript 匿名函数及其代码模式原理
2010/03/19 Javascript
某人初学javascript的时候写的学习笔记
2010/12/30 Javascript
document节点对象的获取方式示例介绍
2013/12/24 Javascript
点击表单提交时出现jQuery没有权限的解决方法
2014/07/23 Javascript
js锁屏解屏通过对$.ajax进行封装实现
2014/07/31 Javascript
JavaScript设计模式之单例模式实例
2014/09/24 Javascript
node.js中的console.dir方法使用说明
2014/12/10 Javascript
js判断登录与否并确定跳转页面的方法
2015/01/30 Javascript
js实现适用于素材网站的黑色多级菜单导航条效果
2015/08/24 Javascript
jQuery实现两款有动画功能的导航菜单代码
2015/09/16 Javascript
javascript实现uploadify上传格式以及个数限制
2015/11/23 Javascript
JS与jQuery遍历Table所有单元格内容的方法
2015/12/07 Javascript
jQuery Validation Engine验证控件调用外部函数验证的方法
2017/01/18 Javascript
socket.io与pm2(cluster)集群搭配的解决方案
2017/06/02 Javascript
Ionic3 UI组件之autocomplete详解
2017/06/08 Javascript
Nodejs 和Session 原理及实战技巧小结
2017/08/25 NodeJs
vue中实现先请求数据再渲染dom分享
2018/03/17 Javascript
vue中利用iscroll.js解决pc端滚动问题
2020/02/15 Javascript
python模拟登录百度贴吧(百度贴吧登录)实例
2013/12/18 Python
python在不同层级目录import模块的方法
2016/01/31 Python
Python List列表对象内置方法实例详解
2019/10/22 Python
python GUI库图形界面开发之PyQt5打印控件QPrinter详细使用方法与实例
2020/02/28 Python
Html5移动端网页端适配(js+rem)
2021/02/03 HTML / CSS
人事经理岗位职责
2014/04/28 职场文书
学校校庆演讲稿
2014/05/22 职场文书
服装区域经理岗位职责
2015/04/10 职场文书
因家庭原因离职的辞职信范文
2015/05/12 职场文书
音乐剧猫观后感
2015/06/04 职场文书
劳动保障事务所个人工作总结
2015/08/12 职场文书
浅谈node.js中间件有哪些类型
2021/04/29 Javascript
在 HTML 页面中使用 React的场景分析
2022/01/18 Javascript