JavaScript で日付を検証する
-
JavaScript の
moment.jsライブラリで日付を検証する - JavaScript で正規表現を使用して日付を検証する
-
JavaScript の
Date.parse()メソッドで日付を検証する
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 関数は、入力として 3つのパラメーターを取ります。1つ目は検証する入力日付、2つ目は日付に従う形式、最後のパラメーターはオプションです。true に設定されている場合は、厳密な解析が使用されます。厳密な解析では、区切り文字を含め、形式と入力が完全に一致している必要があります。最後に、isValid() 関数を使用して、入力日付が有効かどうかを確認し、入力日付が dd/mm/yy の形式と一致する場合はブール値 true を返し、入力した日付が指定した形式と一致しません。
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つのグループがあります。最初のグループは月を表し、2 番目のグループは日を表し、3 番目のグループは年の下 2 桁を表します。スラッシュ/が表示されている場合は常に、グループの開始を表し、バックスラッシュ\はグループの終了を表します。
1 年に 12 か月あります。月を選択する場合、2つの可能性があります。つまり、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 not a valid date format. です。true を返す場合は、This is the valid date format. というメッセージを出力として画面に表示する。
Sahil is a full-stack developer who loves to build software. He likes to share his knowledge by writing technical articles and helping clients by working with them as freelance software engineer and technical writer on Upwork.
LinkedIn