在JavaScript中獲取日期間的相對時間戳差值
您是否在任何網站上見過顯示時間戳的通知?它會顯示類似“12分鐘前”、“2天前”、“10小時前”等資訊。這與兩個日期或時間之間的時間戳差值有關。
此外,一些應用程式會顯示該裝置上次登入時間是22小時前。因此,獲取兩個日期之間的時間戳差值有很多用途。
在本教程中,我們將學習獲取兩個日期之間相對時間戳差值的幾種方法。
使用getTime()方法和日期建立自定義演算法
在JavaScript中,我們可以使用new Date()建構函式建立一個日期物件。此外,我們可以將特定日期作為Date()建構函式的引數,以該日期值初始化日期物件。
getTime()方法返回從1970年1月1日到當前日期的總秒數。因此,我們可以找到兩個日期的總毫秒數,並將它們相減以獲得毫秒差。使用該毫秒數,我們可以找到以秒、分鐘、年等為單位的時間戳差值。
語法
使用者可以按照以下語法獲取兩個日期之間的相對時間戳差值。
let second_diff = (current_date.getTime() - previous_date.getTime())/1000;
在上例語法中,current_date和pervious_date是兩個不同的日期。我們使用getTime()方法獲取兩個日期之間的毫秒差。
注意 − 透過將second_diff變數的值與毫秒數進行比較,您可以獲得相對時間戳差值。
步驟
使用者可以按照以下步驟查詢以天、月、年等不同單位表示的兩個日期之間的相對時間戳。
步驟1 − 建立兩個不同的日期。
步驟2 − 使用getTime()方法獲取兩個日期的總毫秒數,並計算它們的差值。此外,將毫秒差除以1000將其轉換為秒,並將其儲存在second_diff變數中。
步驟3 − 現在,使用if-else條件語句查詢相對時間戳差值。
步驟4 − 如果second_diff的值小於60,則差值以秒為單位。如果second_diff的值介於60和3600之間,則差值以小時為單位。使用者也可以以此類推計算天、月和年。
示例
在下面的示例中,我們使用Date建構函式建立了兩個不同的日期物件,並使用了上述步驟來查詢兩個日期之間的相對時間戳。
在輸出中,使用者可以觀察到以下程式碼表示以月為單位的時間戳差值。
<html>
<body>
<h3>Getting the relative timestamp difference between two dates using the <i> custom algorithm </i></h3>
<p id="output"></p>
<script>
let output = document.getElementById("output");
// creating the current date
let current_date = new Date();
// previous date
let previous_date = new Date("jan 14, 2022 12:21:45");
// finding the difference in total seconds between two dates
let second_diff = (current_date.getTime() - previous_date.getTime()) / 1000;
output.innerHTML += "The first date is " + current_date + "</br>";
output.innerHTML += "The second date is " + previous_date + "</br>";
// showing the relative timestamp.
if (second_diff < 60) {
output.innerHTML += "difference is of " + second_diff + " seconds.";
} else if (second_diff < 3600) {
output.innerHTML += "difference is of " + second_diff / 60 + " minutes.";
} else if (second_diff < 86400) {
output.innerHTML += "difference is of " + second_diff / 3600 + " hours.";
} else if (second_diff < 2620800) {
output.innerHTML += "difference is of " + second_diff / 86400 + " days.";
} else if (second_diff < 31449600) {
output.innerHTML += "difference is of " + second_diff / 2620800 + " months.";
} else {
output.innerHTML += "difference is of " + second_diff / 31449600 + " years.";
}
</script>
</body>
</html>
使用Intl的RelativeTimeFormat() API
Intl指的是國際化API。它包含各種日期和時間格式化方法。我們可以使用Intl物件的RelativeTimeFormat()方法獲取兩個日期之間的相對時間戳。
語法
使用者可以按照以下語法使用RelativeTimeFormat() API獲取兩個日期之間的相對時間戳。
var relativeTimeStamp =
new Intl.RelativeTimeFormat("en", { numeric: "auto",});
// compare the value of RelativeTimeStamp with milliseconds of different time units
在上例語法中,RelativeTimeFormat()方法返回時間戳差值。time_Stamp_unit是一個物件,包含不同的時間單位及其總毫秒數。
步驟
步驟1 − 建立一個單位物件,其中包含時間單位作為鍵,以及該時間單位的總毫秒數作為值。
步驟2 − 獲取兩個日期之間的毫秒時間差。
步驟3 − 現在使用for-in迴圈遍歷time_stamp_unit物件,並檢查second_diff的值是否大於特定時間的總毫秒數;使用RelativeTimeFormat() API的format方法以該特定單位格式化時間戳。
步驟4 − 之後,中斷for迴圈。
示例
在下面的示例中,我們使用了RelativeTimeFomrat()方法來獲取兩個日期之間的相對時間戳差值,如上述語法和步驟中所解釋的那樣。
<html>
<body>
<h3>Getting the relative timestamp difference between two dates using the <i> RelativeTimeFormat() </i> method </h3>
<p id="output"></p>
<script>
let output = document.getElementById("output");
let current_date = new Date();
let previous_date = new Date("jan 14, 2022 12:21:45");
// finding the difference in total seconds between two dates
let second_diff = current_date.getTime() - previous_date.getTime();
output.innerHTML += "The first date is " + current_date + "</br>";
output.innerHTML += "The second date is " + previous_date + "</br>";
var time_Stamp_unit = {
year: 31536000000,
month: 31536000000 / 12,
day: 86400000,
hour: 3600000,
minute: 60000,
second: 1000,
};
var relativeTimeStamp = new Intl.RelativeTimeFormat("en", {
numeric: "auto",
});
// iterate through all time stamps
for (var ele in time_Stamp_unit) {
// if second_diff's value is greater than particular timesapm unit's total millisecond value, format accordingly
if (Math.abs(second_diff) > time_Stamp_unit[ele] || ele == "second") {
output.innerHTML += "The difference between two dates is " + relativeTimeStamp.format(
Math.round(second_diff / time_Stamp_unit[ele]), ele
);
break;
}
}
</script>
</body>
</html>
使用者學習瞭如何使用if-else語句和RelativeTimeFormat() API的format()方法查詢兩個日期之間的相對時間戳。使用者可以根據自己的需求使用這兩種方法。
資料結構
網路
關係資料庫管理系統 (RDBMS)
作業系統
Java
iOS
HTML
CSS
Android
Python
C語言程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP