データ検証は、Web アプリケーションがクライアントからデータを受け入れるための重要なステップです。結局のところ、顧客データが使用する前に、期待される形式に準拠していることを確認する必要があります。 Web アプリケーションでは、ASP.NET、JSP などのプラットフォーム固有のツールを使用することも、JavaScript の正規表現を利用してデータ検証の作業を簡素化することもできます。
正規表現
正規表現は、テキスト内のパターンを表現できるパターン マッチング ツールであり、正規表現をテキスト データを検証するための強力なツールにします。パターン マッチングに加えて、正規表現をテキストの置換にも使用できます。私が UNIX システムで Perl を使用しているときに正規表現に初めて出会って以来、正規表現のサポートは拡大し続けています。
注: 周りに他の開発者がたくさんいる場合、正規表現は RegEx または RegExp と呼ばれる場合があります。正規表現は強力ですが、その構文は少し「謎」で、使いこなすには時間がかかります。正規表現の使用に関する基本的な知識を見てみましょう。
基本構文
正規表現の構文は適用するのが非常に複雑で、このトピックを説明するには本が 1 冊かかることもありますが、正規表現の予備的な理解を助けるために、基本的な知識のいくつかを説明します。
基本的な概念はアンカーです。これを使用すると、文字列の開始点と終了点を指定できます。キャレット (^) は文字列の開始点を指定するために使用され、ドル記号 ($) は終了点を示します。クエリ文字列にキャレットまたはドル記号を含める必要がある場合は、エスケープ文字 () がキャレットまたはドル記号より優先されます。次の例では、文字列内に単語が出現するたびに検索に一致します。
^search$
さらに、文字のグループを検索することもできます。文字を [ や ] などの角かっこで囲むだけです。一致する文字はこの文字グループに属している必要があります。例は [12345] 一致の検索にあります1 ～ 5 の範囲の数値。この正規表現は [1-5] と書くこともできます。
多くの場合、複数回出現できる文字またはオプションの文字を指定する必要があります。疑問符 (?) はその文字がオプションであることを意味し、プラス記号 (+) はその文字が 1 回または複数回出現できることを意味します。 、アスタリスク (*) は、その文字が出現しない、または複数回出現する可能性があることを意味します。
それでは、これらの単純な正規表現を JavaScript に適用する方法を見てみましょう。
JavaScript のサポート
JavaScript はバージョン 1.2 で正規表現のサポートを追加しました。ブラウザのサポートは Internet Explorer 4 と Netscape 4 から始まりました。Firefox のすべてのバージョンと最新のブラウザには JavaScript のサポートが含まれています。正規表現は、JavaScript 文字列および RegExp を通じて使用できます。
文字列の操作
すべての JavaScript 文字列は 3 つのメソッドを通じて正規表現をサポートできます。これらの 3 つのメソッドは match()、replace()、search() です。また、オブジェクトの test() メソッドを使用してテストを実行することもできます。以下は、match()、replace()、および search() メソッドに関する情報です:
match(): 正規表現の一致に使用され、複数の一致が発生した場合、すべての一致結果を含む配列が返されます。各エントリはコピーです。一致するデータが含まれており、一致する値がない場合は null 値が返されます。
replace(): 正規表現を照合し、一致するすべての値を新しい部分文字列に置き換えるのに使用されます。このメソッドの最初のパラメーターは正規表現で、2 番目のパラメーターは置換される文字列です。
search(): 正規表現と指定された文字列の間で一致する値を検索するために使用されます。一致する値が存在しない場合は、文字列のインデックス値が返されます。
JavaScript は、正規表現を作成して使用するための RegExp オブジェクトも提供します。
RegExp
RegExp オブジェクトには正規表現パターンが含まれており、このオブジェクトのメソッドとプロパティを使用して文字列を照合できます。 RegExp オブジェクトのインスタンスを作成するには、コンストラクターを使用する方法と正規表現テキスト パターンを使用する方法があります。 2 番目のパラメータはオプションで、検索がグローバル (g)、大文字と小文字を区別しない (i)、または両方を区別する (gi) かを指定できます。次の例では、コンストラクターを使用して RegExp オブジェクトを作成します。この例では、検索オブジェクトの大文字と小文字は無視されます。
testRegExp = new RegExp("^search$","I")以下に示すように、リテラル メソッド (スラッシュ内の部分) を使用して同じインスタンスを作成できます。
testRegExp = /^search$/i
RegExp オブジェクトには多数のメソッドが含まれていますが、そのうちの 1 つである test のみを紹介します。このメソッドは、指定された文字列に対して正規表現の一致を実行し、成功した場合は true を返し、失敗した場合は false を返します。このメソッドは基本的に、文字列の一致を正規化することができます。このメソッドの使用方法を示します:
testRegExp = /search/i;
if (testRegExp.test("this is a search string") {
document.write("The string was found.");
} else {
document.write("No match found.");
}
We can place it in a Web page to test:
<html><head>
<title>RegExp test</title>
</head><body>
<script language="javascript">
testRegExp = /search/i;
if (testRegExp.test("this is a search string")) {
alert("The string was found.");
} else {
alert("No match found.");
}
</script></body></html>实际操作
现在是讲解更加完整的例子的时候了，在列表A中的网页包含了JavaScript方法来验证文本框中输入的值，这段JavaScript代码将搜索包含我的姓氏和我的两个名字的字符串(忽略大小写)，如果找到了我的名字，则通过字符串对象的替换方法(search)将其替换为一个短名字。第二个文本框是用于接受时间值的，一个正则表达式在此对输入的时间进行合法性验证(数字是通过冒号分割的)。这个简单的例子说明了如何在您的客户端代码中加入正则表达式来进行匹配和替换：
<html><head>
<title>RegExp validation</title>
<script language="JavaScript">
function validate() {
var doc = document.test;
varvalName = new RegExp("^(Tony|Anthony) Patton", "i");
if (doc.Name.value.match(valName) == null) {
alert("Name was not found.");
} else {
doc.Name.value = doc.Name.value.replace(valName, "T. Patton");
}
varvalTime = new RegExp("^([0-1][0-9]|[2][0-3]):([0-5][0-9])$");
if (doc.time.value.match(valTime) == null) {
alert("Please enter correct time format (hh:ss)");
} }
</script></head>
<body><form name="test">
Name: <input type="text" name="Name" value=""><br>
Time: <input type="text" name="time" value=""><br>
<input type="button" name="test" value="test" onClick="validate();">
</form></body></html>强大而复杂
正则表达式的功能确实很强大，但是使用起来也并不简单，因此，应当循序渐进地学习，当然，它确实值得您花上一些时间来学习如何正确使用。正则表达式为JavaScript (以及其他的语言)操作文本，通用软件进行表单验证提供了一个简单而优雅的方法。
更多如何使用JavaScript和正则表达式进行数据验证相关文章请关注PHP中文网！
JavaScriptはCで書かれていますか？証拠を調べるApr 25, 2025 am 12:15 AMはい、JavaScriptのエンジンコアはCで記述されています。1）C言語は、JavaScriptエンジンの開発に適した効率的なパフォーマンスと基礎となる制御を提供します。 2）V8エンジンを例にとると、そのコアはCで記述され、Cの効率とオブジェクト指向の特性を組み合わせて書かれています。3）JavaScriptエンジンの作業原理には、解析、コンパイル、実行が含まれ、C言語はこれらのプロセスで重要な役割を果たします。
JavaScriptの役割：WebをインタラクティブでダイナミックにするApr 24, 2025 am 12:12 AMJavaScriptは、Webページのインタラクティブ性とダイナミズムを向上させるため、現代のWebサイトの中心にあります。 1）ページを更新せずにコンテンツを変更できます。2）Domapiを介してWebページを操作する、3）アニメーションやドラッグアンドドロップなどの複雑なインタラクティブ効果、4）ユーザーエクスペリエンスを改善するためのパフォーマンスとベストプラクティスを最適化します。
CおよびJavaScript：接続が説明しましたApr 23, 2025 am 12:07 AMCおよびJavaScriptは、WebAssemblyを介して相互運用性を実現します。 1）CコードはWebAssemblyモジュールにコンパイルされ、JavaScript環境に導入され、コンピューティングパワーが強化されます。 2）ゲーム開発では、Cは物理エンジンとグラフィックスレンダリングを処理し、JavaScriptはゲームロジックとユーザーインターフェイスを担当します。
Webサイトからアプリまで：JavaScriptの多様なアプリケーションApr 22, 2025 am 12:02 AMJavaScriptは、Webサイト、モバイルアプリケーション、デスクトップアプリケーション、サーバー側のプログラミングで広く使用されています。 1）Webサイト開発では、JavaScriptはHTMLおよびCSSと一緒にDOMを運用して、JQueryやReactなどのフレームワークをサポートします。 2）ReactNativeおよびIonicを通じて、JavaScriptはクロスプラットフォームモバイルアプリケーションを開発するために使用されます。 3）電子フレームワークにより、JavaScriptはデスクトップアプリケーションを構築できます。 4）node.jsを使用すると、JavaScriptがサーバー側で実行され、高い並行リクエストをサポートします。
Python vs. JavaScript：ユースケースとアプリケーションと比較されますApr 21, 2025 am 12:01 AMPythonはデータサイエンスと自動化により適していますが、JavaScriptはフロントエンドとフルスタックの開発により適しています。 1. Pythonは、データ処理とモデリングのためにNumpyやPandasなどのライブラリを使用して、データサイエンスと機械学習でうまく機能します。 2。Pythonは、自動化とスクリプトにおいて簡潔で効率的です。 3. JavaScriptはフロントエンド開発に不可欠であり、動的なWebページと単一ページアプリケーションの構築に使用されます。 4. JavaScriptは、node.jsを通じてバックエンド開発において役割を果たし、フルスタック開発をサポートします。
JavaScript通訳者とコンパイラにおけるC/Cの役割Apr 20, 2025 am 12:01 AMCとCは、主に通訳者とJITコンパイラを実装するために使用されるJavaScriptエンジンで重要な役割を果たします。 1）cは、JavaScriptソースコードを解析し、抽象的な構文ツリーを生成するために使用されます。 2）Cは、Bytecodeの生成と実行を担当します。 3）Cは、JITコンパイラを実装し、実行時にホットスポットコードを最適化およびコンパイルし、JavaScriptの実行効率を大幅に改善します。
JavaScript in Action：実際の例とプロジェクトApr 19, 2025 am 12:13 AM現実世界でのJavaScriptのアプリケーションには、フロントエンドとバックエンドの開発が含まれます。 1）DOM操作とイベント処理を含むTODOリストアプリケーションを構築して、フロントエンドアプリケーションを表示します。 2）node.jsを介してRestfulapiを構築し、バックエンドアプリケーションをデモンストレーションします。
JavaScriptとWeb：コア機能とユースケースApr 18, 2025 am 12:19 AMWeb開発におけるJavaScriptの主な用途には、クライアントの相互作用、フォーム検証、非同期通信が含まれます。 1）DOM操作による動的なコンテンツの更新とユーザーインタラクション。 2）ユーザーエクスペリエンスを改善するためにデータを提出する前に、クライアントの検証が実行されます。 3）サーバーとのリフレッシュレス通信は、AJAXテクノロジーを通じて達成されます。
ホットAIツール
Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ
AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。
Undress AI Tool
脱衣画像を無料で
Clothoff.io
AI衣類リムーバー
Video Face Swap
完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。
人気の記事
ホットツール
SecLists
SecLists は、セキュリティ テスターの究極の相棒です。これは、セキュリティ評価中に頻繁に使用されるさまざまな種類のリストを 1 か所にまとめたものです。 SecLists は、セキュリティ テスターが必要とする可能性のあるすべてのリストを便利に提供することで、セキュリティ テストをより効率的かつ生産的にするのに役立ちます。リストの種類には、ユーザー名、パスワード、URL、ファジング ペイロード、機密データ パターン、Web シェルなどが含まれます。テスターはこのリポジトリを新しいテスト マシンにプルするだけで、必要なあらゆる種類のリストにアクセスできるようになります。
SublimeText3 Linux 新バージョン
SublimeText3 Linux 最新バージョン
DVWA
Damn Vulnerable Web App (DVWA) は、非常に脆弱な PHP/MySQL Web アプリケーションです。その主な目的は、セキュリティ専門家が法的環境でスキルとツールをテストするのに役立ち、Web 開発者が Web アプリケーションを保護するプロセスをより深く理解できるようにし、教師/生徒が教室環境で Web アプリケーションを教え/学習できるようにすることです。安全。 DVWA の目標は、シンプルでわかりやすいインターフェイスを通じて、さまざまな難易度で最も一般的な Web 脆弱性のいくつかを実践することです。このソフトウェアは、
ZendStudio 13.5.1 Mac
強力な PHP 統合開発環境
Safe Exam Browser
Safe Exam Browser は、オンライン試験を安全に受験するための安全なブラウザ環境です。このソフトウェアは、あらゆるコンピュータを安全なワークステーションに変えます。あらゆるユーティリティへのアクセスを制御し、学生が無許可のリソースを使用するのを防ぎます。
ホットトピック
7695
15164014139352128725122929