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/;