一篇文章，掌握 JavaScript Date（日期时间）的使用

Posted 2021-08-21 苛学加

日期时间

日期时间是我们做项目中经常用到的，今天就整理一下。

一、设置相关

1. Date 日期对象

返回当前或指定的日期和时间对象。

• 语法
  • Date() 获取挡墙日期对象
  • Date(datestr) 字符串转日期对象
    • datestr 时间字符串
  • Date(timestamp) 时间戳转日期对象
    • timestamp 时间戳。
  • Date(year, month, day, hours, minutes, seconds, milliseconds)
    • year 年
    • month 月
    • day 日
    • hours 时
    • minutes 分
    • seconds 秒
    • milliseconds 毫秒
• 示例

  //需求：获取当前日期对象
  let date1 = new Date();
  console.log(date1); //Thu Jul 17 2021 09:44:53 GMT+0800 (中国标准时间)
  		
  //需求：根据定字符串获取日期对象
  let date2 = new Date('2021/07/17 09:44:53');
  console.log(date2); //Thu Jul 17 2021 09:44:53 GMT+0800 (中国标准时间)
  		
  //需求：根据定时间戳获取日期对象
  let date3 = new Date(1626486293000);
  console.log(date3); //Thu Jul 17 2021 09:44:53 GMT+0800 (中国标准时间)
  		
  //需求：根据定参数获取日期对象
  let date4 = new Date(2021,7,17,9,44,53,0);
  console.log(date4); //Thu Jul 17 2021 09:44:53 GMT+0800 (中国标准时间)
  

2. 格林威治时间(UTC)概念

UTC 协调世界时即格林威治平太阳时间，是指格林威治所在地的标准时间，也是表示地球自转速率的一种形式，UTC基于国际原子时间。

在UTC的标准上结合各个时区的时间差，即可算出当地时间（东N区便+N小时，西N区便-N小时）。

3. 时间戳概念

时间戳 是指格林威治时间(UTC)1970年01月01日00时00分00秒起至现在的总秒数。
在mysql数据库中，日期通常使用时间戳格式进行保存。

二、获取相关

let date1 = new Date('2021/07/17 09:44:53');
console.log(date1.getFullYear()); //2021 年
console.log(date1.getMonth()); //6 月 需要+1
console.log(date1.getDate()); //17 日
console.log(date1.getHours()); //9 时
console.log(date1.getMinutes()); //44 分
console.log(date1.getSeconds()); //53 秒
console.log(date1.getMilliseconds()); //0 毫秒

1. getFullYear 年份

从 Date 对象以四位数字返回年份。

• 语法
  Date.getFullYear()
  • return 返回年份。
• 示例

  //需求：获取周几
  let date1 = new Date('2021/07/17 09:44:53');
  console.log(date1.getFullYear()); //2021
  

2. getMonth 几月

从 Date 对象返回月份 (0 ~ 11)。
其中，0 为一月。

• 语法
  Date.getMonth()
  • return 返回几月。
• 示例

  //需求：获取周几
  let date1 = new Date('2021/07/17 09:44:53');
  console.log(date1.getMonth()); //6
  

3. getDate 几号

从 Date 对象返回一个月中的某一天 (1 ~ 31)。

• 语法
  Date.getDate()
  • return 返回几号。
• 示例

  //需求：获取几号
  let date1 = new Date('2021/07/17 09:44:53');
  console.log(date1.getDate()); //17
  

4. getHours 小时

返回 Date 对象的小时 (0 ~ 23)。

• 语法
  Date.getHours()
  • return 返回小时。
• 示例

  //需求：获取小时
  let date1 = new Date('2021/07/17 09:44:53');
  console.log(date1.getHours()); //9
  

5. getMinutes 分钟

返回 Date 对象的分钟 (0 ~ 59)。

• 语法
  Date.getMinutes()
  • return 返回分钟。
• 示例

  //需求：获取分钟
  let date1 = new Date('2021/07/17 09:44:53');
  console.log(date1.getMinutes()); //44
  

6. getSeconds 秒

返回 Date 对象的秒数 (0 ~ 59)。

• 语法
  Date.getSeconds()
  • return 返回秒。
• 示例

  //需求：获取秒
  let date1 = new Date('2021/07/17 09:44:53');
  console.log(date1.getSeconds()); //53
  

7. getMilliseconds 毫秒

返回 Date 对象的毫秒(0 ~ 999)。

• 语法
  Date.getMilliseconds()
  • return 返回毫秒。
• 示例

  //需求：获取毫秒
  let date1 = new Date(1626486293732);
  console.log(date1.getMilliseconds()); //732
  

8. getTime 时间戳

返回 1970 年 1 月 1 日至今的毫秒数，及时间戳。

• 语法
  Date.getTime()
  • return 返回时间戳。
• 示例

  //需求：获取周几
  let date1 = new Date('2021/07/17 09:44:53');
  console.log(date1.getTime()); //1626486293000
  

9. parse ``

返回1970年1月1日午夜到指定日期（字符串）的毫秒数。

10. getDay 周几

从 Date 对象返回一周中的某一天 (0 ~ 6)。
其中，0 为周日。

• 语法
  Date.getDay ()
  • return 返回周几。
• 示例

  //需求：获取周几
  let date1 = new Date('2021/07/17 09:44:53');
  console.log(date1.getDay()); //6
  

三、设置相关

1. setFullYear 年

设置 Date 对象中的年份（四位数字）。

2. setMonth 月

设置 Date 对象中月份 (0 ~ 11)。

3. setDate 日

设置 Date 对象中月的某一天 (1 ~ 31)。

4. setHours 时

设置 Date 对象中的小时 (0 ~ 23)。

5. setMinutes 分

设置 Date 对象中的分钟 (0 ~ 59)。

6. setSeconds 秒

设置 Date 对象中的秒钟 (0 ~ 59)。

7. setMilliseconds 毫秒

设置 Date 对象中的毫秒 (0 ~ 999)。

8. setTime 时间戳

以时间戳来设置 Date 对象。

四、UTC获取相关

相比普通时间获取，在get后面增加了UTC标记。

let date1 = new Date('2021/07/17 09:44:53');
console.log(date1.getUTCFullYear()); //2021 年
console.log(date1.getUTCMonth()); //6 月 需要+1
console.log(date1.getUTCDate()); //17 日
console.log(date1.getUTCHours()); //1 时 北京为8时区，所以9-8=1
console.log(date1.getUTCMinutes()); //44 分
console.log(date1.getUTCSeconds()); //53 秒
console.log(date1.getUTCMilliseconds()); //0 毫秒

1. getUTCFullYear 年

根据世界时从 Date 对象返回四位数的年份。

2. getUTCMonth 月

根据世界时从 Date 对象返回月份 (0 ~ 11)。

3. getUTCDate 日

根据世界时从 Date 对象返回月中的一天 (1 ~ 31)。

4. getUTCHours 时

根据世界时返回 Date 对象的小时 (0 ~ 23)。

5. getUTCMinutes 分

根据世界时返回 Date 对象的分钟 (0 ~ 59)。

6. getUTCSeconds 秒

根据世界时返回 Date 对象的秒钟 (0 ~ 59)。

7. getUTCMilliseconds 毫秒

根据世界时返回 Date 对象的毫秒(0 ~ 999)。

8. getTimezoneOffset 时区差值

返回本地时间与格林威治标准时间 (GMT) 的分钟差。

五、UTC设置相关

相比普通时间设置，在set后面增加了UTC标记。
UTC 时间即为 GMT（格林尼治） 时间。

1. setUTCFullYear 年

根据世界时设置 Date 对象中的年份（四位数字）。

2. setUTCMonth 月

根据世界时设置 Date 对象中的月份 (0 ~ 11)。

3. setUTCDate 日

根据世界时设置 Date 对象中月份的一天 (1 ~ 31)。

4. setUTCHours 时

根据世界时设置 Date 对象中的小时 (0 ~ 23)。

5. setUTCMinutes 分

根据世界时设置 Date 对象中的分钟 (0 ~ 59)。

6. setUTCSeconds 秒

根据世界时设置 Date 对象中的秒钟 (0 ~ 59)。

7. setUTCMilliseconds 毫秒

根据世界时设置 Date 对象中的毫秒 (0 ~ 999)。

六、转换相关

1. toString

把 Date 对象转换为字符串。

let date1 = new Date('2021/07/17 09:44:53');
console.log(date1.toString()); //Sat Jul 17 2021 09:44:53 GMT+0800 (中国标准时间)

2. toTimeString

把 Date 对象的时间部分转换为字符串。

let date1 = new Date('2021/07/17 09:44:53');
console.log(date1.toTimeString()); //09:44:53 GMT+0800 (中国标准时间)

3. toDateString

把 Date 对象的日期部分转换为字符串。

let date1 = new Date('2021/07/17 09:44:53');
console.log(date1.toDateString()); //Sat Jul 17 2021

4. toUTCString

根据世界时，把 Date 对象转换为字符串。

let date1 = new Date('2021/07/17 09:44:53');
console.log(date1.toUTCString()); //Sat, 17 Jul 2021 01:44:53 GMT

5. toLocaleString

根据本地时间格式，把 Date 对象转换为字符串。

let date1 = new Date('2021/07/17 09:44:53');
console.log(date1.toLocaleString()); //2021/7/17 上午9:44:53
//这个方法还是比较实用，可以很容易的读懂时间

6. toLocaleTimeString

根据本地时间格式，把 Date 对象的时间部分转换为字符串。

let date1 = new Date('2021/07/17 09:44:53');
console.log(date1.toLocaleTimeString()); //上午9:44:53

7. toLocaleDateString

根据本地时间格式，把 Date 对象的日期部分转换为字符串。

let date1 = new Date('2021/07/17 09:44:53');
console.log(date1.toLocaleDateString()); //2021/7/17

七、其他方法

1. valueOf

返回 Date 对象的原始值。

let date1 = new Date('2021/07/17 09:44:53');
console.log(date1.valueOf()); //1626486293000
//可见在javascript中日期使用时间戳进行计算的

八、常用日期工具

1. 日期格式化

将Date对象转换为指定的日期格式进行输出。
以下方法主要使用了正则表达式进行处理.
对正则表达式感兴趣可以移步至：八千字带你进入正则表达式的世界， 使用少量的代码完成数据验证/提取/替换等操作

//日期格式化
function getFormatDate(fmt, date) { 
	let opt = {
		"y+": date.getFullYear().toString(),// 年
		"M+": date.getMonth() + 1,//月份   
		"d+": date.getDate(), //日   
		"h+": date.getHours(), //小时   
		"m+": date.getMinutes(), //分   
		"s+": date.getSeconds(), //秒   
		"q+": Math.floor((date.getMonth() + 3) / 3), //季度   
		"S": date.getMilliseconds() //毫秒  
		// 有其他格式化字符需求可以继续添加，必须转化成字符串 
	};
	if (/(y+)/.test(fmt))
		fmt = fmt.replace(RegExp.$1, (date.getFullYear() + "").substr(4 - RegExp.$1.length));
	for (var k in opt)
		if (new RegExp("(" + k + ")").test(fmt))
			fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (opt[k]) : (("00" + opt[k]).substr(("" + opt[k]).length)));
	return fmt;
}

示例

var crtTime = new Date('2021/07/17 09:44:53');
console.log(getFormatDate("yyyy-MM-dd hh:mm:ss:S", crtTime));// 2021-07-17 09:44:53:0

2. 获取指定时区的时间

//获取指定时区的时间戳；因为目前还无法直接修改date对象的时区，所以使用时间戳方式返回
function getZoneTime(date, zone) {
	var offset_GMT = date.getTimezoneOffset();
	var current = date.getTime();
	var targetDate = new Date(current + offset_GMT * 60 * 1000 + zone * 60 * 60 * 1000);
	return targetDate.getTime(); 
}

示例

//已知北京（东八区），东京（东九区）；两地时差1小时
var bjdate = new Date('2021/07/17 09:44:53');
var djdate = new Date(getZoneTime(bjdate,9));
console.log('中国北京时间：'+getFormatDate("yyyy-MM-dd hh:mm:ss:S", bjdate)); // 中国北京时间：2021-07-17 09:44:53:0
console.log('日本东京时间：'+getFormatDate("yyyy-MM-dd hh:mm:ss:S", djdate)); // 日本东京时间：2021-07-17 10:44:53:0

3. 字符串时间戳互转

//时间戳转字符串
function getTimeToString(timestamp) {
	return new Date(timestamp).toLocaleString();
}
//字符串转时间戳
function getStringToTime(datestr) {
	return new Date(datestr.replace(/-/g, '/')).getTime();
}

示例

console.log('时间戳转字符串：' + getTimeToString(1626486293000)); // 时间戳转字符串：2021/7/17 上午9:44:53
console.log('字符串转时间戳：' + getStringToTime('2021/07/17 09:44:53')); // 字符串转时间戳：1626486293000

九、注意事项

• 获取月份时，实际月数因为数值+1。
• 获取周几时，0表示的周日。
• ios上时间不能为24:00:00，应该为23:59:59，否则为报错；但是部分浏览器支持该写法。
• iOS上字符串转日期时，尽至此格式yyyy/mm/dd。

  //兼容iOS
  let datestr = '2021-07-17 09:44:53';
  datestr = datestr.replace(/-/g, '/');