js 正規表現の先読みと後読み、および非キャプチャグループ化

js 正規表現の先読みと後読み、および非キャプチャグループ化

先読みと後読みをキャプチャグループと組み合わせる

実際のアプリケーション シナリオでは、キャプチャ グループまたは非キャプチャ グループは通常、先読み条件と後読み条件に制限されます。たとえば、数値 12345678 をフォーマットすると、結果は 12,345,678 になります。通常の実装は次のとおりです。

formatSum = '12345678'.replace(/\B(?=(?:\d{3})+(?!\d))/g, ',') とします。

捕獲グループと非捕獲グループ

先読みと後読みを理解するには、まずキャプチャグループと非キャプチャグループを理解する必要がある。

jsでは、

() はキャプチャグループを意味し、() は $n (n は n 番目のキャプチャグループの内容を示す数値) を使用して各グループ内の一致する値を保存します。

(?:) は非キャプチャ グループを表します。キャプチャ グループとの唯一の違いは、非キャプチャ グループに一致する値が保存されないことです。

formatSum 式を例にとると、(?=(?:\d{3})+(?!\d))、(?:\d{3})、(?!\d) はすべてグループであり、2 番目のグループは非キャプチャ グループです。

前を向いて、後ろを振り返り、そして前を向いて後ろをネガティブに振り返る

上記の formatSum 式では、いわゆる先読みと否定先読みである '?=' と '?!' が使用されています。理解しやすくするために、簡単な例から始めましょう。

// 先読み:
A(?=B) //Bより前にAがあるか検索
// ルックバック:
(?<=B)A //Bの後のAを検索
// 否定先読み:
A(?!B) // Bが後に続かないAを探す
// 否定的なルックバック:
(?<!B)A // B が前にない A を検索

formatSum式を振り返ると、(?:\d{3})+(?!\d)は全体式Aとみなされ、つまり、

formatSum = /\B(?=A)/g //ここでAは式であり、実際の文字Aではありません。理解を容易にするためです。

これは、式 A の前の \B に一致することを意味し、\B は文字以外の境界に一致するため、式の全体的な機能は、式 A の前の境界に一致して置き換えることであることがわかります。

\B に対応するのは \b で、文字の境界に一致します。初心者にとって、境界の概念は理解しにくいものです。境界は目に見えない | と考えることができます。長さが 2 以上である文字列には境界が存在します。たとえば、「ab」は「a|b」とみなされますが、| は表示されず、文字列の長さにはカウントされません。

'ab'.replace(/\B/, ',')
// a,b

次に、式の部分 A を見てみましょう: (?:\d{3})+(?!\d) 。

まず、?: は非キャプチャグループを表し、\d{3} は 3 桁を表し、(?:\d{3})+ は 3、6、9、12... 桁を表します。

(?!\d) は否定の先読みであり、数字が続かない (?:\d{3})+ に一致することを意味します。要約すれば:

(?:\d{3})+(?!\d)  

'12345678' 内の数字以外の 3*n (n=1 増分) 桁 (つまり '678'、'345678') に一致します。

結果は次のとおりです。

formatSum = '12345678'.replace(/\B(?=(?:\d{3})+(?!\d))/g, ',')

'12345678' 内の数字ではない 3*n (n=1, n++) 桁の前の非文字境界に一致します。
つまり、「678」と「345678」の前の非文字境界は最終的にコンマに置き換えられます。
つまり、「3」と「6」の前にカンマを追加します

今すぐ

'12345678'.replace(/\B(?=(?:\d{3})+(?!\d))/g, ',') === '12,345,678'
// 真実

要約する

js 正規表現の先読み、後読み、非キャプチャ グループに関するこの記事はこれで終わりです。js 正規表現の先読み、後読み、非キャプチャ グループの詳細については、123WORDPRESS.COM の以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません:
  • JavaScript における正規表現の実際的な応用の詳細な説明
  • jsは正規表現を使用して年、月、日の例をフィルタリングします
  • js 正規表現の簡単な検証方法
  • Jsは正規表現を使用して文字列から括弧を削除します
  • JavaScriptは正規表現を使用して登録とログインの検証を実装します
  • JavaScript 正規表現の説明

<<:  IE6はmin-widthを実装している

>>:  Ubuntu 20.04 に MySql5.7 をインストールして構成するための詳細なチュートリアル

推薦する

VMware15 の CentOS7 インストールの詳細なプロセスとよくある問題 (画像とテキスト)

1. インストールパッケージの準備VMware-player-15.0.4-12990004、非商...

JS と Nodejs におけるイベント駆動型開発についての簡単な説明

目次イベント駆動型とパブリッシュ・サブスクライブ型ブラウザの JavaScript ではイベント駆動...

Linux のよく使うコマンドの使い方を詳しく解説(第 2 回)———— テキストエディタのコマンド vi/vim

vi/vim の紹介どちらもマルチモード エディターです。違いは、vim が vi のアップグレー...

Docker mongoDB 4.2.1 をインストールし、Springboot ログを収集する詳細な手順

1: dockerにmongodbをインストールするステップ1: dockerにmongodbをイン...

MySQL スケジュールバックアップタスクの簡単な分析

導入実稼働環境では、データの損失を回避するために、通常、データベースは定期的にバックアップされます。...

画像ソーシャルネットワーキングサイトのUIアプリケーションの比較分析(図)

私たちの生活、仕事、勉強において、ソーシャル ネットワークは徐々に将来のインターネット発展のトレンド...

XHTML と CSS の Web ページ作成の問題に対する解決策

XHTML CSS ページ制作中に遭遇する問題の解決策は、解決策と呼ぶには少々大げさです。せいぜい、...

Dockerで同じIDを持つ2つのイメージを削除する

今日 Docker コンテナを作成したとき、誤ってイメージの名前を間違って入力しました。その結果、コ...

Docker に ElasticSearch 6.x をインストールする詳細なチュートリアル

まず、イメージをプルします(またはコンテナを作成するだけで、自然にプルされます)。 docker p...

mysql binlog (バイナリログ) を表示する方法

たとえば、新しいテーブルを作成したり、既存のテーブルのデータを更新したりすると、これらのイベントは、...

HTMLとXHTML、HTML4とHTML5のタグの違いについて簡単に紹介します。

HTML と XHTML の違い1. XHTML要素は正しくネストされている必要がある2. XHT...

スクロールラグの問題を解決するためのオーバーフロースクロールの詳細な説明

序文div またはモジュールに overflow: scroll 属性を使用すると、iOS フォンで...

HTMLはシンプルで美しいログインページを作成します

まずは見てみましょう。 HTML ソースコード: XML/HTML コードコンテンツをクリップボード...

画像マーキー効果を実現するネイティブJS

今日は、ネイティブ JS で実装された画像マーキー効果を紹介します。効果は次のとおりです。 実装され...

mysql サブクエリと結合テーブルの詳細

目次1. サブクエリとは何ですか? 2. 自己結合3. 自然な結合4. 外部接続1. サブクエリとは...