日月如梭,玩转JavaScript日期
一、Date对象
下面出现的源码都可以codepen在线查看。
1)时间戳毫秒计算
Date对象是基于“1970-01-01 08:00:00”到指定日期的毫秒数,不是“00:00:00”。
一天由86,400,000毫秒组成。
var begin = new Date(1970,0,1,0,0,0);//-28800000
begin = new Date(1970,0,1,8,0,0);//
通过上面的代码打印结果,可以看到是相对于8点的毫秒数。
PHP中的时间戳是秒,所以在和PHP互动的时候,要除以1000换算成秒。
2)构造函数
Date的构造函数可以传多种组合的参数:
var date1 = new Date("January 20,2017 11:11:05");
var date2 = new Date("January 20,2017");
var date3 = new Date("2017/01/20 11:11:05");
var date4 = new Date("2017/01/20");
var date5 = new Date(2017,0,20,11,11,5); //月份从0~11
var date6 = new Date(2017,0,20);
var date7 = new Date(1484881865000);
二、Date对象方法
这里只列出部分,更多方法可以参考《JavaScript Date 对象》
下面是图片,不用选中复制了,想复制就点击上面的地址!
月份的范围是“0-11”,而不是“1-12”。
var date = new Date(); //获取一个时间对象
var year = date.getFullYear(); // 获取完整的年份(4位,1970)
var month = date.getMonth(); // 获取月份(0-11,0代表1月,用的时候记得加上1)
var day = date.getDate(); // 获取日(1-31)
var hour = date.getHours(); // 获取小时数(0-23)
var minute = date.getMinutes(); // 获取分钟数(0-59)
var second = date.getSeconds(); // 获取秒数(0-59)
var week = date.getDay(); // 获取一周中的某一天(0-6) 其中周日是0周六是6
三、日期转换时间戳
1. 人类比较喜欢的格式是“2017-01-20 11:11:05:123”;
2. 浏览器更喜欢的格式是“2017/01/20 11:11:05:123”。
第一种格式在转换为时间戳的时候,会有兼容问题,下图所示,更多兼容问题可以参考《JavaScript Date parsing behavior》
可以分两步走,第一步是将格式替换为浏览器喜欢的,第二步是使用方法获取。
1)格式替换
下面的替换用到了简单的正则,更多正则替换可以参考《飞起来的正则表达式》
var dateStr = '2017-01-20 11:11:05:123';
date = new Date(dateStr); //传入一个时间格式,如果不传入就是获取现在的时间了,这样做IOS做Date.parse会返回null
//另外一种方式
date = new Date(dateStr.replace(/-/g, '/'));
2)获取时间戳
用到了4种获取方式,隐式类型转换、getTime、valueOf与Date.parse。
前面3种精确到毫秒,而第4种只能精确到秒。
time1 = +date;//隐式类型转换
time2 = date.getTime();
time3 = date.valueOf();//与getTime功能一样,该方法通常在 JavaScript 内部被调用,而不是在代码中显式调用。
time4 = Date.parse(date);//只能精确到秒
其中隐式转换相当于下面的代码:
function(){
return Number(new Date);
}
上面的代码用到Number对象做转换。
还有更多的方法或对象,例如Boolean、String、Number、parseFloat、parseInt、ToInt32等,可以参考《Javascript Type-Conversion》
“+”加号这个符号,可以将不同数据类型转成不同的值,具体行为可以参考《The unary + operator》
四、常用扩展
1)计算相隔天数
两个日期相减,再除以各种时间单位的换算。
Math.abs(start - end) / 60 / 60 / 1000 / 24;
2)某个月的第一天
设置年月日,天设置为1,最终生成一个日期对象。
new Date(date.getFullYear(), date.getMonth(), 1);
3)某个月的最后一天
同样是三个参数,但最后一个天设置为0,月份设置为下一个月。
new Date(date.getFullYear(), date.getMonth()+1, 0)
4)某个月所在季度的第一天
日期的月份先除以3,再通过符号“~~”获取到整数部分(0、1、2或3),再乘以3获取到季度的第一个月。
//~~作用是将数字转化为32位有符号整数 舍去小数不做四舍五入
new Date(date.getFullYear(), ~~(date.getMonth()/3)*3, 1);
5)某个月所在季度的最后一天
计算方式与上面相同,不同的月份是再加“3”。
new Date(date.getFullYear(), ~~(date.getMonth()/3)*3 + 3, 0)
6)判断是否是闰年
月份设置3月,天设置0,就能获取到2月份的最后一天。
new Date(date.getFullYear(), 2, 0).getDate() == 29
7)某个月份的天数
设置这个日期的下一个月,天数为0。
new Date(date.getFullYear(), date.getMonth()+1, 0).getDate()
还有大家经常会用到的格式化,例如date.format('YYYY年MM月DD日'),返回“2017年01月20日”。
网上有很多代码实现方式,这里就不介绍了。
源码地址:
http://codepen.io/strick/pen/rjyYjX
参考资料:
JavaScript and Dates, What a Mess
日月如梭,玩转JavaScript日期的更多相关文章
- Moment.js 超棒Javascript日期处理类库
Moment.js 不容错过的超棒Javascript日期处理类库 主要特性: 3.2kb超轻量级 独立类库,意味这你不需要倒入一堆js 日期处理支持UNIX 时间戳,String,指定格式的Date ...
- JavaScript日期对象使用总结
javascript Date日期对象的创建 创建一个日期对象: var objDate=new Date([arguments list]); 我总结了参数形式主要有以下3种: new Date(& ...
- 玩下Javascript
玩下Javascript 前言 好久没有更新博客了,也蛮少捣弄javascript,今儿看到一个题目,关于给你一个面板,你可以随意的在上面画矩形,可以移动和删除任意一个你创建的矩形,心血来潮搞着玩哈, ...
- javascript 日期月份加减
项目中需要用到,自己写了一个.javascript日期按月加减 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xh ...
- JavaScript日期时间格式化函数
这篇文章主要介绍了JavaScript日期时间格式化函数分享,需要的朋友可以参考下 这个函数经常用到,分享给大家. 函数代码: //格式化参数说明: //y:年,M:月,d:日,h:时,m分,s:秒, ...
- JavaScript 日期格式化 简单有用
JavaScript 日期格式化 简单有用 代码例如以下,引入jquery后直接后增加下面代码刷新可測试 Date.prototype.Format = function (fmt) { //auth ...
- Javascript 日期格式化
Javascript 日期格式化 需求: 给出:日期 .格式,根据日期格式进行输出. Date.prototype.Format = function (fmt) { //author: meizz ...
- [Javascript] 5个最佳的Javascript日期处理类库
在大家日常网站开发和web应用开发中,我们往往需要有效的调用Javascript处理日期和时间格式相关的函数,在Javascript中已经包含了部分最基本的内建处理方法. 在大家日常网站开发和web应 ...
- JavaScript 日期格式
有四种 JavaScript 日期输入格式: 类型 实例 ISO 日期 "2018-02-19" (国际标准) 短日期 "02/19/2018" 或者 &quo ...
随机推荐
- iOS两个关于对象的关键字
标签: swift新特性(__nullable和__nonnull) 最近在看老师写代码的时候经常遇到两个陌生的关键字,但是当我在我的电脑上敲得时候就是敲不出,后来才知道这是为了swift与OC混编的 ...
- sort用法
一.sort用法sort将文件的每一行作为一个单位,相互比较,比较原则是从首字符向后,依次按ASCII码值进行比较,最后将他们按升序输出.vim 1.txt 1:datadir=/aaa/zzz:2: ...
- [Android]SDK安装
安装Android环境时,出现的问题 //在国内安装Android环境时,经常会因为Google服务器的原因,出现链接失败的问题. Failed to fetch URL http://dl-ssl. ...
- WIN32动态链接库设计与使用
WINDOWS动态链接库技术能很好地实现代码的分模块,综合来说,windows动态链接库分为三种WIN32动态链接库,使用WINDOWS api函数调用设计,贴近底层,体积小,是最初Windows程序 ...
- Android L(5.0)源码之图形与图像处理之简单图片——Bitmap
最近在研究android 5.0的gallery模块,学习了相关的知识点,准备写点博客总结一下,有时间了会补充完整
- Android自定义控件(状态提示图表) (转)
源:Android自定义控件(状态提示图表) 源:Android应用开发 [工匠若水 http://blog.csdn.net/yanbober 转载烦请注明出处,尊重分享成果] 1 背景 前面分析 ...
- 编译Uboot时提示error while loading shared libraries: libz.so.1: cannot open shared object file: No such file or directory
在Ubuntu14.04 64位系统中已经安装了libc6:i386的库,编译Uboot时提示error while loading shared libraries: libz.so.1: cann ...
- 《Web接口开发与自动化测试 -- 基于Python语言》 ---前言
前 言 本书的原型是我整理一份Django学习文档,从事软件测试工作的这六.七年来,一直有整理学习资料的习惯,这种学习理解再输出的方式对我非常受用,博客和文档是我主要的输出形式,这些输出同时也帮 ...
- UVa 357 - Let Me Count The Ways
题目大意:也是硬币兑换问题,与147.674用同样的方法即可解决. #include <cstdio> #include <cstring> #define MAXN 3000 ...
- PHP使用GD2库画图,图像无法输出解决方法
在CS6编辑环境下,使用php的GD2库绘制图像,在浏览器上输出可能会出现图像无法输出的情况,目前发现两个解决方法:方法1:用记事本写,再另存为utf-8 no bom的格式. 方法2:在代码中添加o ...