JavaScript 获取与转换时间戳的完整指南

一、JavaScript 时间转时间戳

在 JavaScript 中获取时间戳共有五种常用方式。其中后四种均需基于实例化的时间对象 new Date() 进行后续操作，因为 JavaScript 处理时间的核心机制依赖于 Date 对象。

方法一：Date.now()

调用 Date.now() 可直接获取当前的时间戳数值。

console.log(Date.now()) //1642471441587

方法二：Date.parse()

Date.parse() 函数可将字符串或时间对象直接转换为时间戳格式。

Date.parse(new Date()) //1642471535000Date.parse("2022/1/18 10:05") //1642471500000

需要注意的是，该方法不推荐使用，因为它会将毫秒级别的精度截断并转换为 000。

方法三：valueOf()

通过调用 valueOf() 函数返回指定对象的原始值，从而获得精确的时间戳。

(new Date()).valueOf() //1642471624512

方法四：getTime()

利用原型方法 getTime() 可直接获取当前时间的毫秒值，结果准确无误。

new Date().getTime() //1642471711588

方法五：Number

使用 Number 构造函数将时间对象强制转换为 number 类型的数值，即得到时间戳。

Number(new Date()) //1642471746435

二、JS 时间戳转时间

我们可以直接使用 new Date(时间戳) 的格式来转换并获得当前时间，例如：

new Date(1472048779952)Wed Aug 24 2016 22:26:19 GMT+0800 (中国标准时间)

注意：时间戳参数必须是 Number 类型。如果传入字符串，解析结果将显示为 Invalid Date。

若后端直接向前端返回时间戳，前端应如何转换呢？下面介绍两种实现方式。

方法一：生成 '2022/1/18 上午10:09 ' 格式

function getLocalTime(n) {return new Date(parseInt(n)).toLocaleString().replace(/:\d{1,2}$/,' ');}getLocalTime(1642471746435) //'2022/1/18 上午10:09 '

也可以使用如下方式，根据需求截取位数，需注意空格也计入字符长度。

function getLocalTime(n) {return new Date(parseInt(n)).toLocaleString().substr(0,14)}getLocalTime(1642471746435) //'2022/1/18 上午10'

或者利用正则表达式进行替换处理。

function  getLocalTime(n){return new Date(parseInt(n)).toLocaleString().replace(/年|月/g, "-").replace(/日/g, " ");}getLocalTime  (1642471746435)  //'2022/1/18 上午10:09:06'

方法二：生成 'yyyy-MM-dd hh:mm:ss ' 格式

先将其转换为 Date 对象，然后通过拼接字符串或使用正则等手段来实现格式化。

function getData(n){n=new Date(n)return n.toLocaleDateString().replace(///g, "-") + " " + n.toTimeString().substr(0, 8)}getData(1642471746435) //'2022-1-18 10:09:06'

不过，这种转换方式在某些浏览器上可能效果不佳，因为 toLocaleDateString() 方法的输出结果因浏览器而异。例如 IE 浏览器显示为 '2016年8月24日 22:26:19' 格式，而搜狗浏览器显示为 'Wednesday, August 24, 2016 22:39:42'。

为了提高兼容性，可以通过分别获取时间的年、月、日并进行拼接来实现。

function getData(n) {let now = new Date(n),y = now.getFullYear(),m = now.getMonth() + 1,d = now.getDate();return y + "-" + (m < 10 ? "0" + m : m) + "-" + (d < 10 ? "0" + d : d) + " " + now.toTimeString().substr(0, 8);}getData(1642471746435) //'2022-1-18 10:09:06'

三、知识普及

1、当前系统区域设置格式（toLocaleDateString 和 toLocaleTimeString）

(new Date()).toLocaleDateString() + " " + (new Date()).toLocaleTimeString()//'2022/1/18 上午10:30:30'

2、普通字符串（toDateString 和 toTimeString）

(new Date()).toDateString() + " " + (new Date()).toTimeString()//'Tue Jan 18 2022 10:30:50 GMT+0800 (中国标准时间)'

3、格林威治标准时间（toGMTString）

(new Date()).toGMTString()//'Tue, 18 Jan 2022 02:31:10 GMT'

4、全球标准时间（toUTCString）

(new Date()).toUTCString()//'Tue, 18 Jan 2022 02:31:25 GMT'

5、Date 对象字符串（toString）

(new Date()).toString()'Tue Jan 18 2022 10:31:44 GMT+0800 (中国标准时间)'

Date 对象构造函数

Date 对象支持多种构造函数形式：

new Date() new Date(milliseconds) new Date(datestring) new Date(year, month) new Date(year, month, day) new Date(year, month, day, hours) new Date(year, month, day, hours, minutes) new Date(year, month, day, hours, minutes, seconds) new Date(year, month, day, hours, minutes, seconds, microseconds)

Date 对象构造函数参数说明：

milliseconds - 距离 JavaScript 内部定义的起始时间 1970 年 1 月 1 日的毫秒数 datestring - 字符串代表的日期与时间。此字符串可以使用 Date.parse() 转换 year - 四位数的年份，如果取值为 0-99，则在其之上加上 1900 month - 0(代表一月)-11(代表十二月) 之间的月份 day - 1-31 之间的日期 hours - 0(代表午夜)-23 之间的小时数 minutes - 0-59 之间的分钟数 seconds - 0-59 之间的秒数 microseconds - 0-999 之间的毫秒数

Date 对象返回值

如果没有任何参数，将返回当前日期;

如果参数为一个数字，将数字视为毫秒值，转换为日期

如果参数为一个字符串，将字符串视为日期的字符串表示，转换为日期

还可以使用六个构造函数精确定义，并返回时间

var d1 = new Date();document.write(d1.toString());var d2 = new Date("2009-08-08 12:12:12); document.write(d2.toString()); var d3 = new Date(2009, 8, 8); document.write(d3.toString());

Date 作为 JavaScript 的一种内置对象，必须使用 new 的方式创建。

Date 对象在 JavaScript 内部的表示方式是，距 1970 年 1 月 1 日午夜 (GMT 时间) 的毫秒数 (时间戳)，我们在这里也把 Date 的内部表示形式称为时间戳。

可以使用 getTime() 将 Date 对象转换为 Date 的时间戳，方法 setTime() 可以把 Date 的时间戳转换为 Date 的标准形式。

Date 函数使用语法

date.方法名(参数1,参数2,...); Date.方法名(); date 代表一个日期对象的实例，Date 代表日期对象，date.方法名调用的为对象的成员函数 Date.方法名调用的为对象的静态函数

var d=new Date();var d2=Date.UTC();

到此这篇关于 JavaScript 获取时间戳的方法总结的文章就介绍到这了,更多相关 JavaScript 时间戳内容请搜索本站以前的文章或继续浏览下面的相关文章希望大家以后多多支持本站！