【JavaScript】バックスラッシュの意味と利用方法|エスケープ処理・正規表現の特殊文字

JavaScriptを勉強中の皆さんはバックスラッシュ(\が入ったコードを見たことがありますか?実はこのバックスラッシュは特殊文字を入力するために必要な大切な記号。

今回はこのバックスラッシュについての解説記事です。JavaScriptを勉強中の方はここでバックスラッシュの使い方をマスターしましょう。

注意
記事内でバックスラッシュ(\)と円記号(¥)が混在する場合がありますが、どちらの記号も意味は同じです。

エスケープシーケンス

JavaScriptでバックスラッシュを使用する場合の多くが、エスケープシーケンス(エスケープ処理)によるものです。

エスケープシーケンスとはバックスラッシュ(\)もしくは円記号(¥)を前に付けて、特殊文字を表す方法です。バックスラッシュか円記号は使用しているOSやデバイスによって異なります。現在は殆どがバックスラッシュで表されるようです。

説明だけでは分かりづらいので、実際のエスケープシーケンスを見てみましょう。

表記方法 意味
\b バックスペース
\t 水平タブ
\v 垂直タブ
\n 改行
\r 復帰
\f 改ページ
\
シングルクォーテーション
\
ダブルクォーテーション
\¥ バッククォート
\0 NULL文字
\xXX
2桁16進数(Latin-1文字)
\uXXXX
4桁16進数(Unicode)
\u{XXXXXX}
16進数コードポイント(Unicode)

頻繁に使用するエスケープシーケンスのコードと実行結果は以下の通りです。

改行

コード内で改行すると、SyntaxError: Invalid or unexpected tokenとエラーが発生します。文字列の中で改行させたい位置にはこの\nを挿入します。

水平タブ

Tabキーを押したときに挿入される水平タブを入れるためのエスケープシーケンスです。

シングルクォーテーション

プログラミング言語の多くはシングルクォーテーションやダブルクォーテーションで文字を表現しますが、その文字中にシングルクォーテーションを使用したい場合のエスケープシーケンスです。

ダブルクォーテーション

シングルクォーテーションと同じ目的で使用します。エスケープシーケンスを使用せずにダブルクォーテーションを入れるとSyntaxError: missing ) after argument listとエラーが発生します。

バッククォート

使用目的はシングルクォーテーションやダブルクォーテーションと同様で、バッククォートを挿入したい場合に使用します。

正規表現

JavaScriptでバックスラッシュを使用するのはエスケープシーケンスだけではありません。バックスラッシュの仕様機会は正規表現でも訪れます。

正規表現とは?

まずは正規表現とは何なのかについて学んでおきましょう。正規表現とは、文字列を一つの文字列形式で表現できる表記法のことをいいます。正規表現では以下の特殊文字を使用します。

 メタ文字  意味
 .  任意の1文字
^  直前の文字が行の先頭にある
 $  直前の文字が行の末尾にある
 []  括弧の中のいずれか1文字
 *  直前の文字を0回以上繰り返す
 +  直前の文字を1回以上繰り返す
 ?  直前の文字が0個か1個
 |  いずれかの条件に当てはまる場合
 ()  文字をグループとしてまとめる

正規表現は多種多様な文字列から効率的に検索を行えるように開発されました。こちらも実際に例を見て確かめましょう。

【元の文章】
私は林檎が好きです。毎朝林檎を必ず食べてから1日をスタートします。

この文章を正規表現を使って表すと次のようになります。

【正規表現】
.は林檎が好きです。..林檎を必ず食べてから.日をスタートします。

例で使用したのは任意の1文字を表すドット(.)。任意の一文字なので、ドットで示された部分は何か1文字が入ります。このように正規表現で文字列を表現すると、条件に当てはまる文字列を一括検索できるのです。

JavaScriptの正規表現とは?一から分かりやすく説明します
JavaScriptの正規表現とは?一から分かりやすく説明します
こんにちは、友達の影響でドライブにハマってしまい、そろそろ車の運転練習しようかと考えている、ペーパードライバー ...

特殊文字を検索する

正規表現で使用した特殊文字をコードに組み込むと、上手く動作しない場合があります。それを回避するためにJavaScriptではバックスラッシュと共にこれらの特殊文字を一緒に使用するのです。

以下のコードをご覧ください。

まず変数宣言で変数samp_stringを作成し、その中にパターン化された123.35を定義しています。パターンにしてまとめると、その文字列をグループとして扱うことが出来るようになります。

ここで使用したtestメソッドは引数に入れた文字列の中に指定した文字が含まれるかを検索するメソッドで、①では124353125.355623の中に含まれているかを検索しています。124353125.355623で途中に125.35があるので結果はtrueです。

しかし②はどうでしょうか。125.35のドットの部分を8に置き換えました。これではパターンとマッチしないことになりますが結果はtrueになっています。

これは先ほど説明した「正規表現」によるものです。機械側では125.35ではなく、125(任意の1文字)35となっているのです。ここでバックスラッシュを入れてみましょう。

今度はドットを文字として読み取ったため、結果がfalseになりました。このようにバックスラッシュは正規表現内で使用する特殊文字を、文字そのものとして理解させるためにも使用できるのです。

まとめ

今回はJavaScriptのバックスラッシュについてお話ししました。正規表現やエスケープシーケンスは入門書にも掲載される基礎知識で、避けては通れません。しかし馴染みがないことから、少し苦手意識がある方も多いのではないでしょうか?

私もこの記事を書いていて、改めて正規表現のややこしさを痛感しました。普段何気なく使用する記号はプログラム内では上手く読み込めない可能性があるので、十分注意し、バックスラッシュを適材適所に利用できるようになりましょう。

特にエスケープシーケンスは必ず覚えておいた方が良い知識です。記憶するように努力するより、とにかくコードの量を書いた方が身につきます。アウトプットを積極的に行っていきましょう!

【初心者向け】JavaScript prototypeの使い方と継承
【初心者向け】JavaScript prototypeの使い方と継承
こんにちは、直也です。 プログラミングの学習は捗っていますでしょうか? さて、本題に入りたいと思います。 Ja ...

BLOGコンテンツをパーソナライズします

あなたは現在「プログラミング学習者」ですか?