在 JavaScript 中驗證日期
在 JavaScript 中驗證日期變得很重要,因為位於不同位置的各個人在輸入日期時遵循不同的格式。在 Web 應用程式中驗證日期時,我們必須遵循特定的格式,以便以後使用日期變得更加容易。
本文將介紹如何在 JavaScript 中以 mm/dd/yy
格式驗證日期。
使用 JavaScript 中的 moment.js
庫驗證日期
moment.js
庫是在 JavaScript 中驗證和格式化日期和時間的最佳,最簡便的方法。我們將使用此庫在 JavaScript 中驗證和顯示日期。要使用此庫,我們首先必須使用以下命令下載它。
npm install -g moment --save
它將在你的系統中安裝一會兒。然後,我們可以直接使用 moment.js
庫中提供的 moment()
方法。以下是在 JavaScript 中使用 moment.js
驗證日期的程式碼。
import * as moment from 'moment';
let result = moment("05/22/12", 'MM/DD/YY',true).isValid();
console.log(result)
輸出:
true
moment
函式採用三個引數作為輸入。第一個是我們要驗證的輸入日期,第二個是我們希望日期遵循的格式,最後一個引數是可選的;如果將其設定為 true
,則將使用嚴格解析。嚴格的分析要求格式和輸入(包括定界符)完全匹配。最後,我們使用 isValid()
函式檢查輸入日期是否有效,如果輸入日期與格式 dd/mm/yy
匹配,則返回布林值 true
,如果與日期匹配,則返回 false
。輸入的日期與指定的格式不匹配。
在 JavaScript 中使用正規表示式驗證日期
正規表示式是驗證日期的好方法。對於正規表示式,許多人面臨的唯一問題是難以理解它們,因為它們包含各種符號和數字。正規表示式中的每個符號或表示式都有其自己的含義。使用這些表示式,我們可以在 JavaScript 中以 dd/mm/yy
格式驗證日期。
<!DOCTYPE html>
<html lang="en">
<head>
<title>Document</title>
</head>
<body>
<h1 id="message"></h1>
<script>
var date_regex = /^(0[1-9]|1[0-2])\/(0[1-9]|1\d|2\d|3[01])\/(0[1-9]|1[1-9]|2[1-9])$/;
var testDate = "03/17/21"
if (date_regex.test(testDate)) {
document.getElementById("message").innerHTML = "Date follows dd/mm/yy format";
}
else{
document.getElementById("message").innerHTML = "Invalid date format";
}
</script>
</body>
</html>
在瀏覽器中輸出:
Date follows dd/mm/yy format
正規表示式/^(0[1-9]|1[0-2])\/(0[1-9]|1\d|2\d|3[01])\/(0[1-9]|1[1-9]|2[1-9])$/
具有 3 個組。第一組代表月
,第二組代表天
,第三組代表年
的後兩位。無論在何處看到正斜槓/
,它都代表該組的開始,而反斜槓\
則代表該組的結束。
一年有 12 個月。因此,選擇月份時有兩種可能性,可以以 0
開頭,後跟數字,或者以 1
開頭,後跟數字 1
或 2
。對於其他組來說,相同的過程是相似的。第二組中的\d
表示 0 到 9 之間的任何數字。你也可以建立用於驗證日期的正規表示式。
然後,我們將此正規表示式儲存在 date_regex
變數中。我們將使用儲存在 myDate
中的日期來檢查日期是否遵循 dd/mm/yy
格式。如果日期遵循此格式,我們將在控制檯內列印 Date follows dd/mm/yy format
;否則,我們將列印 Invalid date format
。
在 JavaScript 中使用 Date.parse()
方法驗證日期
Data.parse()
是 JavaScript 中已經可用的方法。這個方法只接受一個日期作為單一引數,是一個字串。
<!DOCTYPE html>
<html lang="en">
<head>
<title>Document</title>
</head>
<body>
<h1 id="message"></h1>
<script>
let isValidDate = Date.parse('03/17/21');
if (isNaN(isValidDate)) {
document.getElementById('message').innerHTML = "This is not a valid date format.";
}
else{
document.getElementById('message').innerHTML = "This is a valid date format.";
}
</script>
</body>
</html>
在瀏覽器中輸出:
This is a valid date format.
Data.parse()
函式將根據提供的輸入日期返回以毫秒為單位的數字。如果無法識別輸入日期,則它將返回 NaN(不是數字)作為輸出。該函式的結果儲存在 isValidDate
變數中。
如果 isValidDate
變數內的值為 NaN
(不是數字),它將返回 false
,並且將在螢幕上顯示的訊息為 This is a not valid date format.
。如果返回 true
,則將列印訊息 This is a valid date format.
在螢幕上作為輸出。