JavaScript獲取和操作時(shí)間戳的用法詳解
前言
時(shí)間戳在編程中有著非常廣泛的應(yīng)用，比如記錄事件發(fā)生的時(shí)間、計(jì)算時(shí)間差、生成唯一的標(biāo)識(shí)符等等。理解時(shí)間戳的使用非常重要，今天我們將一起來(lái)探討如何在 JavaScript 中獲取和操作時(shí)間戳。?
一、什么是時(shí)間戳？
時(shí)間戳（Timestamp）是指自 1970年1月1日 00:00:00 UTC 到某個(gè)指定時(shí)間的毫秒數(shù)。它是計(jì)算機(jī)系統(tǒng)中最常用的時(shí)間表示方式。這個(gè)時(shí)間標(biāo)準(zhǔn)被稱(chēng)為 Unix 時(shí)間戳 或 POSIX 時(shí)間戳。
二、JavaScript 獲取當(dāng)前時(shí)間戳
在 JavaScript 中，獲取當(dāng)前的時(shí)間戳非常簡(jiǎn)單，通常有兩種常用的方法：
2.1 使用 Date.now() 獲取時(shí)間戳
Date.now() 返回的是自 1970 年 1 月 1 日 UTC 以來(lái)經(jīng)過(guò)的毫秒數(shù)。這是一個(gè)非常簡(jiǎn)單且常用的獲取時(shí)間戳的方法。
示例：
const timestamp = Date.now(); console.log(timestamp); // 輸出當(dāng)前的時(shí)間戳（單位：毫秒）
2.2 使用 new Date().getTime() 獲取時(shí)間戳
new Date().getTime() 也返回當(dāng)前的時(shí)間戳，和 Date.now() 類(lèi)似。兩者的區(qū)別在于，Date.now() 是靜態(tài)方法，而 new Date() 是實(shí)例化對(duì)象后調(diào)用。
示例：
const timestamp = new Date().getTime(); console.log(timestamp); // 輸出當(dāng)前的時(shí)間戳（單位：毫秒）
三、時(shí)間戳的應(yīng)用場(chǎng)景
3.1 獲取當(dāng)前時(shí)間并計(jì)算時(shí)間差
通過(guò)時(shí)間戳，你可以輕松計(jì)算兩個(gè)時(shí)間之間的差異。假設(shè)你需要計(jì)算某個(gè)任務(wù)的執(zhí)行時(shí)間，你可以記錄任務(wù)開(kāi)始和結(jié)束時(shí)的時(shí)間戳，然后通過(guò)相減得到耗時(shí)。
示例：
// 任務(wù)開(kāi)始時(shí)間
const start = Date.now();
// 模擬任務(wù)執(zhí)行
setTimeout(() => {
// 任務(wù)結(jié)束時(shí)間
const end = Date.now();
// 計(jì)算耗時(shí)（單位：毫秒）
const duration = end - start;
console.log(`任務(wù)執(zhí)行時(shí)間：${duration} 毫秒`);
}, 2000);
3.2 轉(zhuǎn)換時(shí)間戳為日期時(shí)間格式
時(shí)間戳通常是一個(gè)數(shù)字，但我們經(jīng)常需要將其轉(zhuǎn)換為易讀的日期格式。在 JavaScript 中，你可以使用 Date 對(duì)象將時(shí)間戳轉(zhuǎn)換為日期。
示例：
const timestamp = Date.now(); const date = new Date(timestamp); console.log(date.toString()); // 輸出類(lèi)似 "Sat Feb 23 2025 12:34:56 GMT+0800 (中國(guó)標(biāo)準(zhǔn)時(shí)間)" 的日期格式
你也可以使用 toLocaleString() 方法將日期格式化為特定的本地格式。
const dateStr = date.toLocaleString(); console.log(dateStr); // 輸出類(lèi)似 "2025/2/23 下午12:34:56" 的本地日期時(shí)間格式
3.3 將日期時(shí)間轉(zhuǎn)換為時(shí)間戳
如果你有一個(gè)特定的日期，并希望將其轉(zhuǎn)換為時(shí)間戳，可以通過(guò) Date.parse() 方法來(lái)實(shí)現(xiàn)。該方法將一個(gè)表示日期的字符串轉(zhuǎn)化為時(shí)間戳。
示例：
const dateStr = "2025-02-23T12:00:00"; const timestamp = Date.parse(dateStr); console.log(timestamp); // 輸出時(shí)間戳（單位：毫秒）
3.4 時(shí)間戳與計(jì)時(shí)器
時(shí)間戳還廣泛應(yīng)用于控制和記錄定時(shí)器（如 setTimeout 和 setInterval）的執(zhí)行時(shí)間。你可以利用時(shí)間戳計(jì)算任務(wù)間隔和延遲。
示例：
const start = Date.now();
setInterval(() => {
const elapsed = Date.now() - start;
console.log(`已運(yùn)行時(shí)間：${elapsed} 毫秒`);
}, 1000); // 每秒打印一次已運(yùn)行的時(shí)間
四、總結(jié)
時(shí)間戳在 JavaScript 中非常有用，常常用于記錄時(shí)間、計(jì)算時(shí)間差和處理異步操作。掌握如何獲取和操作時(shí)間戳，可以讓你更高效地進(jìn)行時(shí)間計(jì)算和時(shí)間相關(guān)的操作。
| 概念 | 說(shuō)明 | 示例代碼 |
|---|---|---|
| 獲取當(dāng)前時(shí)間戳 | 使用 Date.now() 或 new Date().getTime() 獲取當(dāng)前時(shí)間的時(shí)間戳。 | const timestamp = Date.now(); |
| 計(jì)算時(shí)間差 | 通過(guò)記錄開(kāi)始時(shí)間和結(jié)束時(shí)間的時(shí)間戳，計(jì)算時(shí)間差。 | const duration = end - start; |
| 時(shí)間戳轉(zhuǎn)換為日期格式 | 使用 new Date(timestamp) 將時(shí)間戳轉(zhuǎn)換為日期對(duì)象，然后格式化為字符串。 | const date = new Date(timestamp); console.log(date.toString()); |
| 日期轉(zhuǎn)換為時(shí)間戳 | 使用 Date.parse() 將日期字符串轉(zhuǎn)換為時(shí)間戳。 | const timestamp = Date.parse('2025-02-23T12:00:00'); |
| 時(shí)間戳與定時(shí)器的結(jié)合 | 使用時(shí)間戳與定時(shí)器（setTimeout / setInterval）結(jié)合來(lái)控制時(shí)間。 | setInterval(() => { const elapsed = Date.now() - start; }, 1000); |
希望通過(guò)這篇文章，你對(duì) JavaScript 中的時(shí)間戳有了更清晰的了解。
附：倒計(jì)時(shí)抽獎(jiǎng)案例
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>簡(jiǎn)單易用的倒計(jì)時(shí)js代碼</title>
<style>
*{ margin:0; padding:0; list-style:none;}
body{ font-size:18px; text-align:center;}
.time{ height:30px; padding:200px;}
</style>
</head>
<body>
<div class="time">
<span id="t_d">00天</span>
<span id="t_h">00時(shí)</span>
<span id="t_m">00分</span>
<span id="t_s">00秒</span>
</div>
<script>
function GetRTime(){
//雙十一倒計(jì)時(shí)抽獎(jiǎng)
var EndTime= new Date('2018/11/11 00:00:00');
var NowTime = new Date();
var t =EndTime.getTime() - NowTime.getTime();
var d=Math.floor(t/1000/60/60/24);
var h=Math.floor(t/1000/60/60%24);
var m=Math.floor(t/1000/60%60);
var s=Math.floor(t/1000%60);
document.getElementById("t_d").innerHTML = d + "天";
document.getElementById("t_h").innerHTML = h + "時(shí)";
document.getElementById("t_m").innerHTML = m + "分";
document.getElementById("t_s").innerHTML = s + "秒";
}
setInterval(GetRTime,0);
</script>
</body>
</html>
到此這篇關(guān)于JavaScript獲取和操作時(shí)間戳用法詳解的文章就介紹到這了,更多相關(guān)JS時(shí)間戳使用內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
- JavaScript將時(shí)間戳轉(zhuǎn)換為日期格式的多種轉(zhuǎn)換方法
- 利用JavaScript實(shí)現(xiàn)時(shí)間戳功能的5種方法詳解
- JavaScript?中的時(shí)間戳操作和使用詳解
- JavaScript時(shí)間戳與時(shí)間的轉(zhuǎn)化常用方法
- JavaScript時(shí)間戳與時(shí)間相互轉(zhuǎn)換的常用方法
- javascript日期字符串轉(zhuǎn)換為時(shí)間戳的5種方法總結(jié)
- JS時(shí)間戳與日期格式的轉(zhuǎn)換小結(jié)
- 基于JavaScript編寫(xiě)一個(gè)時(shí)間戳轉(zhuǎn)換工具
相關(guān)文章
Three.js?中的屏幕空間環(huán)境光遮蔽SSAO
這篇文章主要為大家介紹了Three.js?中屏幕空間環(huán)境光遮蔽SSAO的原理及實(shí)現(xiàn)解析，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-04-04
axios?POST提交數(shù)據(jù)的三種請(qǐng)求方式寫(xiě)法示例
這篇文章主要介紹了axios?POST提交數(shù)據(jù)的三種請(qǐng)求方式寫(xiě)法示例,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-09-09
js 數(shù)組操作之pop,push,unshift,splice,shift
本篇文章主要介紹了js數(shù)組操作之pop,push,unshift,splice,shift。需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助2014-01-01
js仿微博實(shí)現(xiàn)統(tǒng)計(jì)字符和本地存儲(chǔ)功能
這篇文章主要介紹了js仿微博實(shí)現(xiàn)統(tǒng)計(jì)字符和本地存儲(chǔ)功能的相關(guān)資料,需要的朋友可以參考下2015-12-12
Enum是TypeScript提供的自定義類(lèi)型,用來(lái)定義一組有名字的常量集合, 本文就來(lái)介紹一下Enum兩種常用類(lèi)型（數(shù)字枚舉和字符串枚舉）以及高級(jí)小技巧,具有一定參考價(jià)值,感興趣的可以了解一下2026-01-01
javascript表格控件：Chgrid，簡(jiǎn)化型
javascript表格控件：Chgrid，簡(jiǎn)化型...2007-04-04
利用JavaScript實(shí)現(xiàn)繪制2023新年煙花的示例代碼
大家過(guò)年好！新春佳節(jié)，在這個(gè)充滿喜悅的日子里，愿新年的鐘聲帶給你一份希望和期待。在這喜慶的日子里，小編和大家分享一個(gè)煙花代碼，希望大家能夠喜歡2023-01-01
js實(shí)現(xiàn)網(wǎng)頁(yè)隨機(jī)驗(yàn)證碼
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)網(wǎng)頁(yè)隨機(jī)驗(yàn)證碼，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-10-10
jsonp實(shí)現(xiàn)百度下拉框功能的方法分析
這篇文章主要介紹了jsonp實(shí)現(xiàn)百度下拉框功能的方法,結(jié)合實(shí)例形式分析了調(diào)用百度接口jsonp實(shí)現(xiàn)跨域請(qǐng)求及內(nèi)容渲染相關(guān)操作技巧,需要的朋友可以參考下2019-05-05
本篇文章是對(duì)使用js設(shè)置url參數(shù)的實(shí)現(xiàn)代碼進(jìn)行了詳細(xì)的分析介紹，需要的朋友參考下2013-07-07