JS--エスケープ処理

エスケープ処理

【開発環境】

OS：Win11（64ビット）

VSCode1.72.2、

クロム

【特別な意味を持つ文字をエスケープする】
正規表現のパターンで使われる文字の中にはドット(.)やプラス(+)などのように特別な意味を持つ文字があります。

これらはメタ文字と呼ばれます。例えば次のような正規表現リテラルで見てみます。

サンプルコード

let regexp = /a.b/;
console.log(regexp.test('oa.bo'));結果> true

console.log(regexp.test('oaxbo'));結果> true

最初に試した 'oa.bo' は文字列の中に a.b という文字列が含まれるのでマッチするのは分かりますが、次に試した 'oaxbo' は文字列の中に a.b という文字列が含まれていないのにマッチしました。 これはパターンの中でドット(.)を記述した場合、このドットは任意の 1 文字とマッチする特別な意味を持つからです。その為、 /a.b/ は 'a.b' だけでなく 'axb' や 'aYb' など「a」で始まり「b」で終わる 3 文字の文字列にマッチします。

サンプル2
let regexp = /a\.b/;

console.log(regexp.test('oa.bo'));
> true
console.log(regexp.test('oaxbo'));
> false

「a」「.」「b」の 3 つの文字が連続している文字列だけにマッチする

なおエスケープを行うために使用するバックスラッシュ(\)も特別な意味を持つ文字なので、バックスラッシュ自身を一つの文字としてマッチさせたい場合は同じようにバックスラッシュを使って '\\' と記述してください。

let regexp = /\\/;

【正規表現リテラルを使用する場合のスラッシュについて】
正規表現オブジェクトを正規表現リテラルを使って作成する場合、正規表現リテラルでは前後をスラッシュ(/)で囲んで記述するため、パターンの中でスラッシュを記述する場合はエスケープ処理が必要となります。

サンプル
a/b のようなパターンを正規表現リテラルを使って記述する場合、次のようにそのまま記述してしまうとエラーとなります。

let regexp = /a/b/;
>> SyntaxError: Invalid regular expression flags

スラッシュの前にバックスラッシュ(\)を記述してエスケープ処理をしてください。

let regexp = /a\/b/;

ただし、
正規表現オブジェクトを RegExp コンストラクタを使って作成する場合(文字列としてパターンを指定する場合)はスラッシュは特別な意味を持たないためエスケープする必要はありません。

let regexp = new RegExp('a/b');

【RegExpオブジェクトのコンストラクタを使用する場合】

正規表現オブジェクトを RegExp コンストラクタを使って作成する場合に、パターンを文字列で指定するときには注意が必要となります。

new RegExp('パターン');

JavaScript の文字列の中でバックスラッシュは文字に対するエスケープを行う文字という特別な意味を持つ文字なので、バックスラッシュ(\)に対してエスケープ処理が必要となります。

例えばパターンの中で \d と記述した場合、バックスラッシュ + d という意味ではなく 0 から 9 までの数字とマッチする特殊な文字としての意味を持ちます。 \d のようなパターンを文字列で記述する場合、バックスラッシュは文字列としてのエスケープ文字ではなくパターンにおける特別な文字とし扱って欲しいので、バックスラッシュの前にバックスラッシュを記述して(文字列としての)エスケープ処理をしてください。

let regexp = new RegExp('\\d');

なお正規表現オブジェクトを正規表現リテラルとして作成する場合はバックスラッシュに対する文字列としてのエスケープは必要はありません。

let regexp = /\d/;

 

 

JS--正規表示

正規表示

【開発環境】

OS：Win11（64ビット）

VSCode1.72.2、

クロム

 

■正規表示とは→
指定した条件に一致する複数の文字列を一つのパターンで表現する方法です。 JavaScript では正規表現もオブジェクトのひとつです。

 

【正規表現リテラル】
正規表現オブジェクトとは正規表現で使用するパターンを定義することです。最初に正規表現リテラルを使って正規表現オブジェクトを作成する方法です。

・書式

/パターン/
/パターン/フラグ

正規表現のパターンを表す値をスラッシュ(/)で囲んで記述します。
フラグを設定する場合はスラッシュのあとに記述します。

サンプル

let regexp1 = /apple/;
let regexp2 = /[a-zA-Z]{4}/;

一つ目の正規表現オブジェクトは 'apple' とマッチするパターンです。対象の文字列の中に 'apple' と同じ文字列が含まれていればこの正規表現とマッチします。

二つ目の正規表現オブジェクトは特別な意味を持つメタ文字を使って記述したパターンで、アルファベットで構成された 4 文字の文字列とマッチします。

フラグを設定する場合は、フラグを表す値を一つまたは複数記述します。

let regexp1 = /[a-z]{4}/i;
let regexp2 = /[a-z]{4}/im;

一つ目の正規表現オブジェクトには i フラグを設定しており、二つ目の正規表現オブジェクトには i フラグと g フラグを設定しています。

【RegExpコントラスタを使う】
次に RegExp オブジェクトのコンストラクタを使用して正規表現オブジェクトを作成する方法です。

・書式
new RegExp(パターン[, フラグ])
1 番目の引数には正規表現リテラルを指定するか、パターンを表す値を文字列として記述します。

フラグを設定する場合は 2 番目の引数に一つまたは複数のフラグを文字列として記述します。

サンプル

let regexp1 = new RegExp(/lemon/);
let regexp2 = new RegExp('lemon');

どちらも同じ正規表現オブジェクトを作成します。パターンを文字列として指定する場合はスラッシュ(/)で囲う必要はない点に注意してください。

フラグを設定する場合は次のように記述します。

let regexp1 = new RegExp(/lemon/, 'i');
let regexp2 = new RegExp('lemon', 'ig');

正規表現のパターンがあらかじめ決まっているのであれば基本的に正規表現リテラルを使って正規表現オブジェクトを作成するのがシンプルで分かりやすいかと思います。
パターンが決まっていない場合はパターンを文字列として指定できる RegExp コンストラクタを使います。

例文

let regexp1 = /movie/;
let regexp2 = /driving/;
let str = 'I like movies and sports'

console.log(regexp1.test(str));
>> true

console.log(regexp2.test(str));
>> false

RegExp オブジェクトのインスタンスメソッドである test は文字列が正規表現にマッチするかどうかを調べ論理値を返します。

正規表現オブジェクトを 2 つ作成し、対象となる文字列がそれぞれの正規表現オブジェクトとマッチするかどうかを調べました。

対象の文字列には 'movie' が含まれているので最初の正規表現にはマッチしましたが、対象の文字列には 'driving' は含まれていないので次の正規表現にはマッチしませんでした。