ホームページ >ウェブフロントエンド >jsチュートリアル >JS の RegExp オブジェクト オブジェクト Regular_JavaScript スキル

JS の RegExp オブジェクト オブジェクト Regular_JavaScript スキル

WBOY
WBOYオリジナル
2016-05-16 17:48:361078ブラウズ

RegExp オブジェクトのインスタンスを作成するには 2 つの方法があります。

RegExp の明示的なコンストラクターを使用します。構文は new RegExp("pattern"[,"flags"]) です。
RegExp の暗黙的コンストラクターをプレーン テキスト形式で使用します: /pattern/[flags]。

パターン部分は、使用される正規表現パターンのテキストであり、必須です。最初の方法では、パターン部分は JavaScript 文字列の形式で存在し、二重引用符または一重引用符で囲む必要があります。2 つ目の方法では、パターン部分は 2 つの「/」でネストされており、引用符は使用できません。 。

flags 部分は、正規表現のフラグ情報を設定します (オプション)。フラグ部分が設定されている場合、最初の方法では文字列の形式で存在し、2 番目の方法では最後の「/」文字の直後のテキストの形式で存在します。 flags には、次のフラグ文字を組み合わせて指定できます。
g はグローバルフラグです。このフラグが設定されている場合、テキストに対する検索と置換の操作は、テキストの一致するすべての部分に影響します。このフラグが設定されていない場合は、最も古い一致のみが検索され、置換されます。

i は大文字と小文字を無視するフラグです。このフラグが設定されている場合、一致比較を行うときに大文字と小文字が無視されます。

m は複数行のフラグです。このフラグが設定されていない場合、メタキャラクタ「^」は検索文字列全体の先頭のみと一致し、メタキャラクタ「$」は検索文字列の末尾のみと一致します。このフラグが設定されている場合、「^」を「」と組み合わせることもできます。 "または" " は後の位置 (つまり、次の行の先頭) に一致し、"$" も " に一致します。 "または" " は、" の後の位置 (つまり、次の行の末尾) に一致します。

コード 1.1 は、正規表現を作成する例です。
コード 1.1 正規表現を作成します。 1.1.htm

コードをコピー コードは次のとおりです。

;head>
正規表現の作成

;



上記のコードの実行結果を図 8.1 に示します。
JavaScript 文字列の "" はエスケープ文字であるため、明示的に使用します。コンストラクターが RegExp インスタンス オブジェクトを作成する場合、元の正規表現の "" は "" に置き換えられます。たとえば、コード 1.2 の 2 つのステートメントは同等です。
コード 1.2 の "" はエスケープされます。



コードをコピー コードは次のとおりです:


正規表現パターンテキスト内のエスケープ文字も「"」であるため、正規表現内でリテラル文字「"」を照合する場合は、明示的に使用する場合は正規表現パターンテキスト内で「"」で表現する必要があります。構築 関数を使用して RegExp インスタンス オブジェクトを作成する場合、リテラル文字 "" を表すために "\" を使用する必要があります。
var re = 新しい RegExp(\\)。

1 RegExp オブジェクトのプロパティ

RegExp オブジェクトのプロパティは、静的プロパティとインスタンス プロパティに分けられます。以下に個別に紹介します。

1.1 静的属性
(1) インデックス属性。これは、現在の表現パターンの最初に一致するコンテンツの開始位置です (0 から数えます)。初期値は -1 で、一致が成功するたびにインデックス属性がそれに応じて変更されます。
(2) 入力属性。処理対象の現在の文字列を返します。これは $_ と省略できます。初期値は空の文字列 "" です。
(3)lastIndex 属性。現在の表現パターンが最初に一致するコンテンツ内の最後の文字の次の位置です。カウントは 0 から始まります。初期値は -1 で、検索を継続することを意味します。開始位置から開始され、一致するたびに、それに応じて lastIndex 属性値が変更されます。
(4)lastMatch 属性。現在の式パターンの最後に一致する文字列です。$& と省略できます。初期値は空の文字列「」です。 lastMatch 属性の値は、一致が成功するたびに変化します。
(5)lastParen 属性。式パターン内に囲まれた部分一致がある場合、それは現在の式パターン内の最後の部分一致と一致する部分文字列であり、$ と省略できます。初期値は空の文字列「」です。 lastParen 属性の値は、一致が成功するたびに変化します。
(6) leftContext 属性。現在の式パターンで最後に一致する文字列の左側にあるすべての文字列であり、$` と省略できます (「'」はキーボードの「Esc」の下にある逆引用符です)。初期値は空文字列「」です。一致が成功するたびに、そのプロパティ値が変化します。
(7) rightContext 属性。これは、現在の式パターンで最後に一致する文字列の右側にあるすべてのものであり、$' と省略できます。初期値は空文字列「」です。一致が成功するたびに、そのプロパティ値が変化します。
(8) $1…$9 の属性。これらのプロパティは読み取り専用です。式パターン内に囲まれたサブマッチがある場合、$1...$9 属性値は、それぞれ最初から 9 番目のサブマッチによってキャプチャされた内容になります。 9 個を超える部分一致がある場合、$1...$9 属性はそれぞれ最後の 9 個の部分一致に対応します。式パターンでは、括弧で囲まれたサブマッチをいくつでも指定できますが、RegExp オブジェクトは最後の 9 つのサブマッチの結果のみを保存できます。 RegExp インスタンス オブジェクトの一部のメソッドによって返される結果配列では、括弧内のすべての部分一致結果を取得できます。

1.2 インスタンス属性

(1) グローバル属性。 RegExp オブジェクト インスタンスの作成時に指定されたグローバル フラグ (g) のステータスを返します。 RegExp オブジェクト インスタンスの作成時に g フラグが設定されている場合、このプロパティは True を返します。それ以外の場合、デフォルト値は False を返します。
(2)ignoreCase 属性。 RegExp オブジェクト インスタンスの作成時に指定されたignoreCase フラグ (i) のステータスを返します。 RegExp オブジェクト インスタンスの作成時に i フラグが設定されている場合、このプロパティは True を返します。それ以外の場合、デフォルト値は False を返します。
(3) multiLine 属性。 RegExp オブジェクト インスタンスの作成時に指定された multiLine フラグ (m) のステータスを返します。 RegExp オブジェクト インスタンスの作成時に m フラグが設定されている場合、このプロパティは True を返します。それ以外の場合、デフォルト値は False を返します。
(4) ソース属性。 RegExp オブジェクト インスタンスの作成時に指定された式テキスト文字列を返します。

JS の RegExp オブジェクト (2)

2 RegExp オブジェクトのメソッド
RegExp オブジェクトの一般的なメソッドには、test、exec、compile があります。の機能と使い方を紹介します。最後に、RegExp オブジェクトのプロパティとメソッドの包括的な例を示します。
2.1 テストメソッド
構文形式は test(str) です。このメソッドは、RegExp オブジェクト インスタンスの作成時に指定された式パターンが文字列内に存在するかどうかを確認し、存在する場合は True を返し、存在しない場合は False を返します。一致が見つかった場合、RegExp オブジェクト内の関連する静的プロパティが更新されて、一致が反映されます。
2.2 exec メソッド
構文形式は exec(str) です。このメソッドは、RegExp オブジェクト インスタンスの作成時に指定された式パターンを使用して文字列を検索し、検索結果を含む配列を返します。
正規表現にグローバル フラグ (g) が設定されている場合は、exec メソッドと test メソッドを複数回呼び出して、そのたびに lastIndex で指定された位置から文字の検索を開始することで、文字列内で継続的な検索を実行できます。 RegExp オブジェクト文字列の属性値。
グローバル フラグ (g) が設定されていない場合、exec メソッドと test メソッドは RegExp オブジェクトの lastIndex 属性値を無視し、文字列の先頭から検索を開始します。
exec メソッドで一致が見つからない場合、戻り値は null になります。一致が見つかった場合は、配列が返され、その一致を反映するように RegExp オブジェクト内の関連する静的プロパティが更新されます。返された配列の要素 0 には完全な一致結果が含まれ、要素 1 ~ n は式パターンで定義された各部分一致の結果です。
exec メソッドによって返される配列には、input、index、lastIndex という 3 つの属性があります。
入力属性は、検索される文字列全体です。
index 属性は、検索文字列全体内の一致する位置を参照します。
lastIndex 属性は、一致した部分文字列の最後の文字の次の文字位置を参照します。
コード 2.1 は、このメソッドの応用例です。
コード 2.1 exec() メソッドの適用: 2.1.htm
コードをコピー コードは次のとおりです。 🎜>

exec() メソッド <br><script language = "JavaScript"> >var myString="aaa 111 bbb 222 ccc 1111 222ddd"; <br>var regex = /111/; //正規表現オブジェクトを作成します<br>var array=regex.exec(myString); ){ <br>var str="一致する部分文字列が見つかりました!" "n返される配列の値は次のとおりです:" array "n配列要素の数:" <br> array.length "n検索された文字列は次のとおりです:" input <br> "n 個の一致する部分文字列の開始位置は次のとおりです。" array.index <br> "n 個の一致する部分文字列の後の最初の文字の位置は次のとおりです。" regex.lastIndex; <br>} else{ <br>alert("一致する部分文字列が見つかりません!!"); <br></script> <br> </html> <br><br> <br><br>2.3 コンパイル方法 <br><br><br>構文形式は、compile("pattern"[,"flags"]) です。このメソッドは、RegExp オブジェクト インスタンスによって使用される表現パターンを置き換え、新しい表現パターンを内部形式にコンパイルして、後続の一致プロセスを高速化します。式をループ内で再利用する場合は、式をコンパイルすると実行速度が向上します。ただし、プログラム内で他の式パターンが使用された後に、最初にコンパイルされた式パターンが使用される場合、このようなコンパイルによる利点はありません。 <br><br> </div>2.4 包括的な例 <br><strong><br>コード 2.2 は、RegExp オブジェクトの包括的な例です。コードとその演算結果を注意深く分析すると、RegExp オブジェクトをより深く理解できます。 </strong>コード 2.2 RegExp オブジェクトの使用法: 2.2.htm <br><br><br><strong><br>コードをコピー </strong><br><br> コードは次のとおりです: <br><div class="codetitle"> <span><script language="javascript"> <a style="CURSOR: pointer" data="79159" class="copybut" id="copybut79159" onclick="doCopy('code79159')">var strSrc = "xxa1b01c001yya2b02c002zz"; <u>var re = /a(d)b(d{2})c(d{3})/ gi; </u>var arr, count = 0; </a>while ((arr = re.exec(strSrc)) != null) </span>{ </div>displayResult(); displayResult() <div class="codebody" id="code79159">{ <br>document.write("<p>これは正規表現/" re.source "/gi を string<br>"" <BR> RegExp.input "" (count ) "検索結果: <br>"); <BR>document.write("RegExp.index は " RegExp.index "<br>"); <BR>document.write("RegExp. lastIndex は " RegExp.lastIndex "<br>"); <br>document.write("RegExp.lastMatch は " RegExp.lastMatch "<br>"); <BR>document.write("RegExp.lastParen は " RegExp. lastParen "<br>"); <br>document.write("RegExp.leftContext は " RegExp.leftContext "<br>"); <BR>document.write("RegExp.rightContext は " RegExp .rightContext " <br>"); <br>document.write("RegExp.$1 は " RegExp.$1 "<br>"); <BR>document.write("RegExp.$2 は " RegExp.$2 " <br>"); <br>document.write("RegExp.$3 は " RegExp.$3 "<br>"); <BR>document.write("RegExp.$4 は " RegExp.$4 "< ; br>"); <br>document.write("arr.index is " arr.index "<br>"); <BR>document.write("arr.input is " arr.input "<br> ; "); <BR>document.write("arr.lastIndex は " arr.lastIndex "<br>"); <BR>document.write("返された配列の要素数は " arr.length "< ; br>"); <br>document.write("返された配列の内容は ["]; <br>for(var i=0; i<arr.length i>{ <br> if(i < arr.length-1) <BR>document.write(""" arr[i] "","); <BR>else <BR>document.write(""" arr[i] " ")</p>"); <br>} <br>} <br></script></arr.length> </div> </div></div><div class="nphpQianMsg"><div class="clear"></div></div><div class="nphpQianSheng"><span>声明:</span><div>この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。</div></div></div><div class="nphpSytBox"><span>前の記事:<a class="dBlack" title="Javascript の継承 (パート 1) - オブジェクト構築の概要_JavaScript" href="https://m.php.cn/ja/faq/18502.html">Javascript の継承 (パート 1) - オブジェクト構築の概要_JavaScript</a></span><span>次の記事:<a class="dBlack" title="Javascript の継承 (パート 1) - オブジェクト構築の概要_JavaScript" href="https://m.php.cn/ja/faq/18504.html">Javascript の継承 (パート 1) - オブジェクト構築の概要_JavaScript</a></span></div><div class="nphpSytBox2"><div class="nphpZbktTitle"><h2>関連記事</h2><em><a href="https://m.php.cn/ja/article.html" class="bBlack"><i>続きを見る</i><b></b></a></em><div class="clear"></div></div><ins class="adsbygoogle" style="display:block" data-ad-format="fluid" data-ad-layout-key="-6t+ed+2i-1n-4w" data-ad-client="ca-pub-5902227090019525" data-ad-slot="8966999616"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({}); </script><ul class="nphpXgwzList"><li><b></b><a href="https://m.php.cn/ja/faq/1609.html" title="Bootstrap リスト グループ コンポーネントの詳細な分析" class="aBlack">Bootstrap リスト グループ コンポーネントの詳細な分析</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/ja/faq/1640.html" title="JavaScript関数のカリー化の詳細説明" class="aBlack">JavaScript関数のカリー化の詳細説明</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/ja/faq/1949.html" title="JS パスワードの生成と強度検出の完全な例 (デモ ソース コードのダウンロード付き)" class="aBlack">JS パスワードの生成と強度検出の完全な例 (デモ ソース コードのダウンロード付き)</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/ja/faq/2248.html" title="Angularjs は WeChat UI (weui) を統合します" class="aBlack">Angularjs は WeChat UI (weui) を統合します</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/ja/faq/2351.html" title="JavaScript を使用して繁体字中国語と簡体字中国語をすばやく切り替える方法と、簡体字中国語と繁体字中国語の切り替えをサポートする Web サイトのトリック_javascript スキル" class="aBlack">JavaScript を使用して繁体字中国語と簡体字中国語をすばやく切り替える方法と、簡体字中国語と繁体字中国語の切り替えをサポートする Web サイトのトリック_javascript スキル</a><div class="clear"></div></li></ul></div></div><ins class="adsbygoogle" style="display:block" data-ad-format="autorelaxed" data-ad-client="ca-pub-5902227090019525" data-ad-slot="5027754603"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({}); </script><footer><div class="footer"><div class="footertop"><img src="/static/imghwm/logo.png" alt=""><p>福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!</p></div><div class="footermid"><a href="https://m.php.cn/ja/about/us.html">私たちについて</a><a href="https://m.php.cn/ja/about/disclaimer.html">免責事項</a><a href="https://m.php.cn/ja/update/article_0_1.html">Sitemap</a></div><div class="footerbottom"><p> © php.cn All rights reserved </p></div></div></footer><script>isLogin = 0;</script><script type="text/javascript" src="/static/layui/layui.js"></script><script type="text/javascript" src="/static/js/global.js?4.9.47"></script></div><script src="https://vdse.bdstatic.com//search-video.v1.min.js"></script><link rel='stylesheet' id='_main-css' href='/static/css/viewer.min.css' type='text/css' media='all'/><script type='text/javascript' src='/static/js/viewer.min.js?1'></script><script type='text/javascript' src='/static/js/jquery-viewer.min.js'></script><script>jQuery.fn.wait = function (func, times, interval) { var _times = times || -1, //100次 _interval = interval || 20, //20毫秒每次 _self = this, _selector = this.selector, //选择器 _iIntervalID; //定时器id if( this.length ){ //如果已经获取到了,就直接执行函数 func && func.call(this); } else { _iIntervalID = setInterval(function() { if(!_times) { //是0就退出 clearInterval(_iIntervalID); } _times <= 0 || _times--; //如果是正数就 -- _self = $(_selector); //再次选择 if( _self.length ) { //判断是否取到 func && func.call(_self); clearInterval(_iIntervalID); } }, _interval); } return this; } $("table.syntaxhighlighter").wait(function() { $('table.syntaxhighlighter').append("<p class='cnblogs_code_footer'><span class='cnblogs_code_footer_icon'></span></p>"); }); $(document).on("click", ".cnblogs_code_footer",function(){ $(this).parents('table.syntaxhighlighter').css('display','inline-table');$(this).hide(); }); $('.nphpQianCont').viewer({navbar:true,title:false,toolbar:false,movable:false,viewed:function(){$('img').click(function(){$('.viewer-close').trigger('click');});}}); </script></body></html>