JavaScript 日期和時間的格式化

JavaScript 日期和時間的格式化

一、日期和時間的格式化

1、原生方法

1.1、使用 toLocaleString 方法

Date 對象有一個 toLocaleString 方法,該方法可以根據本地時間和地區設置格式化日期時間。例如:

const date = new Date();
console.log(date.toLocaleString("en-US", { timeZone: "America/New_York" })); // 2/16/2023, 8:25:05 AM
console.log(date.toLocaleString("zh-CN", { timeZone: "Asia/Shanghai" })); // 2023/2/16 上午8:25:05

toLocaleString 方法接受兩個參數,第一個參數是地區設置,第二個參數是選項,用于指定日期時間格式和時區信息。

1.2、使用 Intl.DateTimeFormat 對象

Intl.DateTimeFormat 對象能使日期和時間在特定的語言環境下格式化。可以使用該對象來生成一個格式化日期時間的實例,并根據需要來設置日期時間的格式和時區。例如:

const date = new Date();
const formatter = new Intl.DateTimeFormat("en-US", {timeZone: "America/New_York",year: "numeric",month: "numeric",day: "numeric",hour: "numeric",minute: "numeric",second: "numeric",
});
console.log(formatter.format(date)); // 2/19/2023, 9:17:40 AMconst dateCN = new Date();
const formatterCN = new Intl.DateTimeFormat("zh-CN", {timeZone: "Asia/Shanghai",year: "numeric",month: "2-digit",day: "2-digit",hour: "2-digit",minute: "2-digit",second: "2-digit",
});
console.log(formatterCN.format(dateCN)); // 2023/02/19 22:17:40

可以在選項中指定需要的日期時間格式,包括年、月、日、時、分、秒等。同時也可以設置時區信息。

2、使用字符串操作方法

可以使用字符串操作方法來將日期時間格式化為特定格式的字符串。例如:

const date = new Date();
const year = date.getFullYear().toString().padStart(4, "0");
const month = (date.getMonth() + 1).toString().padStart(2, "0");
const day = date.getDate().toString().padStart(2, "0");
const hour = date.getHours().toString().padStart(2, "0");
const minute = date.getMinutes().toString().padStart(2, "0");
const second = date.getSeconds().toString().padStart(2, "0");
console.log(`${year}-${month}-${day} ${hour}:${minute}:${second}`); // 2023-02-16 08:25:05

以上代碼使用了字符串模板和字符串操作方法,將日期時間格式化為 YYYY-MM-DD HH:mm:ss 的格式。可以根據實際需要來修改格式。

3、自定義格式化函數

3.1、不可指定格式的格式化函數

可以編寫自定義函數來格式化日期時間。例如:

function formatDateTime(date) {const year = date.getFullYear();const month = date.getMonth() + 1;const day = date.getDate();const hour = date.getHours();const minute = date.getMinutes();const second = date.getSeconds();return `${year}-${pad(month)}-${pad(day)} ${pad(hour)}:${pad(minute)}:${pad(second)}`;
}function pad(num) {return num.toString().padStart(2, "0");
}const date = new Date();
console.log(formatDateTime(date)); // 2023-02-16 08:25:05

以上代碼定義了一個 formatDateTime 函數和一個 pad 函數,用于格式化日期時間并補齊數字。可以根據需要修改格式,因此通用性較低。

3.2、可指定格式的格式化函數

下面是一個通用較高的自定義日期時間格式化函數的示例:

function formatDateTime(date, format) {const o = {"M+": date.getMonth() + 1, // 月份"d+": date.getDate(), // 日"h+": date.getHours() % 12 === 0 ? 12 : date.getHours() % 12, // 小時"H+": date.getHours(), // 小時"m+": date.getMinutes(), // 分"s+": date.getSeconds(), // 秒"q+": Math.floor((date.getMonth() + 3) / 3), // 季度S: date.getMilliseconds(), // 毫秒a: date.getHours() < 12 ? "上午" : "下午", // 上午/下午A: date.getHours() < 12 ? "AM" : "PM", // AM/PM};if (/(y+)/.test(format)) {format = format.replace(RegExp.$1,(date.getFullYear() + "").substr(4 - RegExp.$1.length));}for (let k in o) {if (new RegExp("(" + k + ")").test(format)) {format = format.replace(RegExp.$1,RegExp.$1.length === 1 ? o[k] : ("00" + o[k]).substr(("" + o[k]).length));}}return format;
}

這個函數接受兩個參數,第一個參數是要格式化的日期時間,可以是 Date 對象或表示日期時間的字符串,第二個參數是要格式化的格式,例如 yyyy-MM-dd HH:mm:ss。該函數會將日期時間格式化為指定的格式,并返回格式化后的字符串。

該函數使用了正則表達式來匹配格式字符串中的占位符,然后根據對應的日期時間值來替換占位符。其中,y 會被替換為年份,M、d、h、H、m、s、q、S、a、A 分別表示月份、日期、小時(12 小時制)、小時(24 小時制)、分鐘、秒、季度、毫秒、上午/下午、AM/PM。

使用該函數進行日期時間格式化的示例如下:

const date = new Date();
console.log(formatDateTime(date, "yyyy-MM-dd HH:mm:ss")); // 2023-02-16 08:25:05
console.log(formatDateTime(date, "yyyy年MM月dd日 HH:mm:ss")); // 2023年02月16日 08:25:05
console.log(formatDateTime(date, "yyyy-MM-dd HH:mm:ss S")); // 2023-02-16 08:25:05 950
console.log(formatDateTime(date, "yyyy-MM-dd hh:mm:ss A")); // 2023-02-16 08:25:05 上午

可以根據實際需要修改格式化的格式,以及支持更多的占位符和格式化選項。

4、使用第三方庫

除了原生的方法外,還有很多第三方庫可以用來格式化日期時間,例如 Moment.js 和 date-fns 等。這些庫提供了更多的日期時間格式化選項,并且可以兼容不同的瀏覽器和環境。

const date = new Date();
console.log(moment(date).format("YYYY-MM-DD HH:mm:ss")); // 2023-02-16 08:25:05
console.log(dateFns.format(date, "yyyy-MM-dd HH:mm:ss")); // 2023-02-16 08:25:05

以上是幾種常用的日期時間格式化方法,在進行日期時間格式化時,可以使用原生的方法、自定義函數或第三方庫,選擇合適的方法根據實際需要進行格式化。

二、日期和時間的其它常用處理方法

1、創建 Date 對象

要創建一個 Date 對象,可以使用 new Date(),不傳入任何參數則會使用當前時間。也可以傳入一個日期字符串或毫秒數,例如:

const now = new Date(); // 當前時間
const date1 = new Date("2022-01-01"); // 指定日期字符串
const date2 = new Date(1640995200000); // 指定毫秒數

2、日期和時間的獲取

Date 對象可以通過許多方法獲取日期和時間的各個部分,例如:

const date = new Date();
const year = date.getFullYear(); // 年份,例如 2023
const month = date.getMonth(); // 月份,0-11,0 表示一月,11 表示十二月
const day = date.getDate(); // 日期,1-31
const hour = date.getHours(); // 小時,0-23
const minute = date.getMinutes(); // 分鐘,0-59
const second = date.getSeconds(); // 秒數,0-59
const millisecond = date.getMilliseconds(); // 毫秒數,0-999
const weekday = date.getDay(); // 星期幾,0-6,0 表示周日,6 表示周六

3、日期和時間的計算

可以使用 Date 對象的 set 方法來設置日期和時間的各個部分,也可以使用 get 方法獲取日期和時間的各個部分,然后進行計算。例如,要計算兩個日期之間的天數,可以先將兩個日期轉換成毫秒數,然后計算它們之間的差值,最后將差值轉換成天數,例如:

const date1 = new Date("2022-01-01");
const date2 = new Date("2023-02-16");
const diff = date2.getTime() - date1.getTime(); // 毫秒數
const days = diff / (1000 * 60 * 60 * 24); // 天數

4、日期和時間的比較

可以使用 Date 對象的 getTime() 方法將日期轉換成毫秒數,然后比較兩個日期的毫秒數大小,以確定它們的順序。例如,要比較兩個日期的先后順序,可以將它們轉換成毫秒數,然后比較它們的大小,例如:

const date1 = new Date("2022-01-01");
const date2 = new Date("2023-02-16");
if (date1.getTime() < date2.getTime()) {console.log("date1 在 date2 之前");
} else if (date1.getTime() > date2.getTime()) {console.log("date1 在 date2 之后");
} else {console.log("date1 和 date2 相等");
}

5、日期和時間的操作

可以使用 Date 對象的一些方法來進行日期和時間的操作,例如,使用 setDate() 方法設置日期,使用 setHours() 方法設置小時數,使用 setTime() 方法設置毫秒數等等。例如,要將日期增加一天,可以使用 setDate() 方法,例如:

const date = new Date();
date.setDate(date.getDate() + 1); // 增加一天
console.log(date.toLocaleDateString()); // 輸出增加一天后的日期

6、獲取上周、本周、上月、本月和本年的開始時間和結束時間

以下是 JavaScript 獲取本周、上周、本月、上月和本年的開始時間和結束時間的代碼示例:

// 獲取本周的開始時間和結束時間
function getThisWeek() {const now = new Date();const day = now.getDay() === 0 ? 7 : now.getDay(); // 將周日轉換為 7const weekStart = new Date(now.getFullYear(),now.getMonth(),now.getDate() - day + 1);const weekEnd = new Date(now.getFullYear(),now.getMonth(),now.getDate() + (6 - day) + 1);return { start: weekStart, end: weekEnd };
}// 獲取上周的開始時間和結束時間
function getLastWeek() {const now = new Date();const day = now.getDay() === 0 ? 7 : now.getDay(); // 將周日轉換為 7const weekStart = new Date(now.getFullYear(),now.getMonth(),now.getDate() - day - 6);const weekEnd = new Date(now.getFullYear(),now.getMonth(),now.getDate() - day);return { start: weekStart, end: weekEnd };
}// 獲取本月的開始時間和結束時間
function getThisMonth() {const now = new Date();const monthStart = new Date(now.getFullYear(), now.getMonth(), 1);const monthEnd = new Date(now.getFullYear(), now.getMonth() + 1, 0);return { start: monthStart, end: monthEnd };
}// 獲取上月的開始時間和結束時間
function getLastMonth() {const now = new Date();const monthStart = new Date(now.getFullYear(), now.getMonth() - 1, 1);const monthEnd = new Date(now.getFullYear(), now.getMonth(), 0);return { start: monthStart, end: monthEnd };
}// 獲取本年的開始時間和結束時間
function getThisYear() {const now = new Date();const yearStart = new Date(now.getFullYear(), 0, 1);const yearEnd = new Date(now.getFullYear(), 11, 31);return { start: yearStart, end: yearEnd };
}

上述代碼中,getThisWeek()、getLastWeek()、getThisMonth()、getLastMonth() 和 getThisYear() 函數分別返回當前時間所在的本周、上周、本月、上月和本年的開始時間和結束時間。這些函數使用了 Date 對象的方法,例如 getFullYear()、getMonth() 和 getDate() 等。它們可以用于獲取需要進行時間區間計算的場景,例如統計某個時間范圍內的數據等。

使用這些函數獲取時間區間的示例:

const thisWeek = getThisWeek();
console.log(thisWeek.start); // 本周的開始時間
console.log(thisWeek.end); // 本周的結束時間const lastWeek = getLastWeek();
console.log(lastWeek.start); // 上周的開始時間
console.log(lastWeek.end); // 上周的結束時間const thisMonth = getThisMonth();
console.log(thisMonth.start); // 本月的開始時間
console.log(thisMonth.end); // 本月的結束時間const lastMonth = getLastMonth();
console.log(lastMonth.start); // 上月的開始時間
console.log(lastMonth.end); // 上月的結束時間

使用這些函數可以方便地獲取需要的時間區間,并進行后續的操作。

7、根據出生日期計算年齡

以下是一個根據出生日期計算年齡的代碼示例,包括了對閏年的處理:

function calculateAge(birthDate) {const birthYear = birthDate.getFullYear();const birthMonth = birthDate.getMonth();const birthDay = birthDate.getDate();const now = new Date();let age = now.getFullYear() - birthYear;if (now.getMonth() < birthMonth ||(now.getMonth() === birthMonth && now.getDate() < birthDay)) {age--;}// 檢查閏年const isLeapYear = (year) =>(year % 4 === 0 && year % 100 !== 0) || year % 400 === 0;const isBirthLeapYear = isLeapYear(birthYear);// 調整閏年的年齡if (isBirthLeapYear && birthMonth > 1) {age--;}if (isLeapYear(now.getFullYear()) && now.getMonth() < 1) {age--;}return age;
}

這個函數接收一個 Date 對象作為參數,代表出生日期。該函數計算當前日期與出生日期之間的時間差,以確定年齡。其中,使用 Date 對象的 getFullYear()、getMonth() 和 getDate() 方法獲取出生日期的年、月和日。使用當前日期的年、月和日計算出年齡。如果當前月份小于出生月份,或當前月份等于出生月份但當前日期小于出生日期,則年齡減一。在這個函數中,定義了一個 isLeapYear() 函數,用于檢查給定的年份是否為閏年。然后,在計算年齡時,調用這個函數,檢查出生年份和當前年份是否為閏年。如果出生年份為閏年且出生月份在二月或之后,則年齡減一。如果當前年份為閏年且當前月份在一月或之前,則年齡減一。這樣,就可以正確計算含有閏年的出生日期的年齡了。

這種計算年齡的方法僅是基于當前日期和出生日期之間的時間差,而不是考慮具體的月份和日期。因此,對于生日還未到的人,計算的年齡會比實際年齡小一歲。

使用這個函數計算年齡的示例:

const birthDate = new Date("1990-01-01");
const age = calculateAge(birthDate);
console.log(age); // 33

上述代碼中,構造了一個 Date 對象,它代表出生日期。然后調用 calculateAge() 函數,將出生日期作為參數傳入。該函數返回當前日期與出生日期之間的時間差,以確定年齡。最后打印計算出的年齡。

8、其他相關的知識點

在使用 Date 對象時,需要注意以下幾點:

  • 月份從 0 開始,0 表示一月,11 表示十二月;
  • getDate() 方法返回的是日期,而 getDay() 方法返回的是星期幾;
  • Date 對象的年份是完整的四位數,例如 2023;
  • 使用 new Date() 創建 Date 對象時,返回的是當前時區的時間,如果需要使用 UTC 時間,可以使用 new Date(Date.UTC())。

JavaScript 中的 Date 對象提供了許多方法和屬性,可以用于處理日期和時間,根據具體情況選擇適合的方法和技巧。

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/bicheng/18735.shtml
繁體地址,請注明出處:http://hk.pswp.cn/bicheng/18735.shtml
英文地址,請注明出處:http://en.pswp.cn/bicheng/18735.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

buuctf_RE

[WMCTF2020]easy_re 簡單輸入flag 但是下斷點后&#xff0c;還沒走幾步就報錯退出了。 確實沒有打印的字符串 main函數也看不懂在干嘛 int __cdecl main(int argc, const char **argv, const char **envp) {__int64 v4; // r13char v5; // r12__int64 v6; // rax_QWORD *v7;…

python計算開始時間到結束時間步長一個小時

為了計算從開始時間到結束時間&#xff0c;每隔一小時的時間間隔&#xff0c;你可以使用Python的datetime模塊來處理日期和時間。以下是一個簡單的例子&#xff0c;它生成從開始時間到結束時間每隔一小時的時間列表。 from datetime import datetime, timedelta# 開始時間 sta…

SylixOS 版本與 RealEvo-IDE 版本對應關系說明

SylixOS 版本與 RealEvo-IDE 版本對應關系說明 SylixOS 版本IDE 版本發布日期1.4.13.1.52017/01/171.5.23.5.12017/10/121.7.13.8.32018/06/221.8.33.9.52018/10/081.9.9-103.9.102020/01/021.11.63.10.22020/05/131.11.73.10.x2020/06/121.12.93.11.02020/09/111.12.11&#…

多輸入多輸出 | MATLAB實現BiTCN(雙向時間卷積神經網絡)多輸入多輸出預測

多輸入多輸出 | MATLAB實現BiTCN(雙向時間卷積神經網絡)多輸入多輸出預測 目錄 多輸入多輸出 | MATLAB實現BiTCN(雙向時間卷積神經網絡)多輸入多輸出預測預測效果基本介紹程序設計參考資料 預測效果 基本介紹 Matlab實現BiTCN雙向時間卷積神經網絡多輸入多輸出預測 1.data為數據…

json格式文件備份redis數據庫 工具

背景&#xff1a; 項目組要求使用 json備份redis緩存數據庫內容。 附件里工具是一個包含redis-dump工具的鏡像文件&#xff0c;方便用戶在局域網中使用容器備份redis緩存數據庫。 使用步驟&#xff1a; 解壓tar文件&#xff0c;導入鏡像 docker load < redis_dump_of_my…

【八股系列】HTTP請求特征是什么?

文章目錄 1. HTTP&#xff08;超文本傳輸協議&#xff09;請求具有以下主要特征&#xff1a;1.1 請求行(Request Line):1.2 請求頭(Request Headers):1.3 請求正文(Request Body):1.4 狀態碼(Status Code):1.5 無狀態性(Statelessness):1.6 緩存支持(Cacheability):1.7 方法多樣…

力扣刷題--2535. 數組元素和與數字和的絕對差【簡單】

題目描述 給你一個正整數數組 nums 。 元素和 是 nums 中的所有元素相加求和。 數字和 是 nums 中每一個元素的每一數位&#xff08;重復數位需多次求和&#xff09;相加求和。 返回 元素和 與 數字和 的絕對差。 注意&#xff1a;兩個整數 x 和 y 的絕對差定義為 |x - y| 。…

JWT下token過期的處理策略

策略1 最簡單最直接的方式 用戶再次輸入他們的登錄憑證&#xff0c;如用戶名和密碼&#xff0c;得到一個新的token 策略2 采用單token的方式&#xff1a; 設置 token 過期時間&#xff1b; 前端發起請求&#xff0c;后端驗證 token 是否過期&#xff08;JWT工具類有一個&a…

面試專區|【DevOps-46道DevOps高頻題整理(附答案背誦版)】

簡述什么是 DevOps工作流程 &#xff1f; DevOps工作流程是一種將開發和運維團隊緊密結合起來的方法&#xff0c;旨在實現軟件開發和交付的高效性和可靠性。它強調自動化和持續集成&#xff0c;以便頻繁地進行軟件交付和部署。 DevOps工作流程通常包括以下階段&#xff1a; …

【最優化方法】實驗三 無約束最優化方法的MATLAB實現

實驗的目的和要求&#xff1a;通過本次實驗使學生進一步熟悉掌握使用MATLAB軟件&#xff0c;并能利用該軟件進行無約束最優化方法的計算。 實驗內容&#xff1a; &#xff11;、最速下降法的MATLAB實現 &#xff12;、牛頓法的MATLAB實現 &#xff13;、共軛梯度法的MATLAB…

請簡述vue2和vue3的區別

Vue2和Vue3作為Vue.js框架的兩個主要版本&#xff0c;在多個方面存在顯著的差異。以下是它們之間主要區別的詳細概述&#xff1a; 生命周期函數鉤子&#xff1a; Vue2&#xff1a;包含了一系列的生命周期鉤子函數&#xff0c;如beforeCreate、created、beforeMount等&#xff0…

/lib、/lib64和/usr/local/lib的區別

在Linux系統中&#xff0c;/lib、/lib64 和 /usr/local/lib 這幾個目錄都用于存放庫文件&#xff08;即共享庫或動態鏈接庫&#xff09;&#xff0c;但它們在用途和管理上有一些區別。 /lib 這個目錄通常包含了系統啟動和運行所必需的共享庫。這些庫通常是核心系統組件和關鍵工…

計量和測量的區別有哪些?兩者的關系是什么樣的?

計量和測量在行業內經常被混用&#xff0c;更不用說外行人對計量和測量的定義不夠清晰&#xff0c;無論是看字面還是定義&#xff0c;似乎兩者沒有什么太大的區別&#xff0c;但實際上&#xff0c;兩者還是有區別的&#xff0c;不過又存在千絲萬縷的聯系&#xff0c;那么計量和…

【數據結構】冒泡排序、直接插入排序、希爾排序詳解!

文章目錄 1. 冒泡排序&#x1f34e;2. 直接插入排序&#x1f34e;3. 希爾排序&#xff08;縮小增量排序&#xff09;&#x1f34e; 1. 冒泡排序&#x1f34e; &#x1f427; 基本思想&#xff1a; 比較相鄰的元素。如果第一個比第二個大&#xff0c;就交換他們兩個。 大的數據…

在編程中百分號表示什么:深度解析其多重角色與應用

在編程中百分號表示什么&#xff1a;深度解析其多重角色與應用 在編程的廣闊領域中&#xff0c;百分號&#xff08;%&#xff09;這一看似簡單的符號&#xff0c;實則承載著多重含義與功能。它既是數學運算的得力助手&#xff0c;又是字符串格式化的關鍵工具&#xff0c;甚至在…

Midjourney繪畫關鍵詞參數匯總(一)

在數字藝術和創意設計領域&#xff0c;參數化繪畫技術正日益受到關注。Midjourney作為一家領先的藝術技術公司&#xff0c;推出了一系列繪畫關鍵詞參數&#xff0c;為藝術家和設計師們提供了全新的創作工具。本文將介紹Midjourney繪畫關鍵詞參數的匯總&#xff0c;探索其在數字…

適合能源企業的文檔安全外發系統應該是什么樣的?

能源企業是市場經濟中的重要組成&#xff0c;也是社會可持續長遠發展的關鍵組成之一&#xff0c;能源行業在開拓新能源業務線、提升產能的日常經營中&#xff0c;也需要與外部合作伙伴、客戶間進行密切的業務往來&#xff0c;文檔可能涉及多個領域多個類型。 能源供應合同&…

Vue3 之 動態組件和KeepAlive組件

一、動態組件 1、簡介 ? 在某些業務場景下&#xff0c;頁面的某模塊具有多個組件但在同一時間只顯示一個&#xff0c;需要在多個組件之間進行頻繁的切換&#xff0c;如&#xff1a;tab切換等場景。除了可以使用v-if、v-show根據不同條件顯示不同組件之外&#xff0c;還可以通…

深入理解模型驅動測試:優點、挑戰與應用場景

本文翻譯自&#xff1a;Understanding Model-Based Testing: Benefits, Challenges, and Use Cases 原文作者&#xff1a;Qt Group質量保證市場營銷主管Sebastian Polzin 審校&#xff1a;Jinjing Li 對于那些尋求系統化和條理化測試方法的測試工程師而言&#xff0c;模型驅動…

ROS2 Topics和Services

本文主要介紹ROS的Topics概念&#xff0c;如何創建Publisher和Subscriber&#xff0c;通過Topic在ROS程序間通信&#xff1b;介紹ROS的Services概念&#xff0c;如何創建Client和Server并建立通信。 更多內容&#xff0c;訪問專欄目錄獲取實時更新。 ROS Topics Topics可以被視…