JavaScript - エスケープ シーケンスの一覧

JavaScriptに限らず、 プログラミングで文字列を扱う場合に、改行コードやタブ文字を含ませたい場合があります。 その時に必要となってくるのがエスケープシーケンスです。

エスケープシーケンスとは

文字列の中で、改行やタブを表したい場合や、 "や'のような特別な意味を表したい場合、 「\n」、「\t」、「\"」、「\'」というように「\ + 文字」の形式で表します。

この「\ + 文字」のことをエスケープシーケンスといいます。

エスケープシーケンスの一覧

主なエスケープシーケンスの一覧です。

エスケープシーケンス	説明	備考
\0	NULL文字
\b	バックスペース
\f	改ページ、フォーム フィード	空白
\n	改行、ラインフィード	行終端文字
\r	復帰、キャリッジ リターン	行終端文字
\t	タブ	空白
\v	垂直タブ	空白
\\	円記号
\'	シングルクォート
\"	ダブルクォート
\xXX	2桁の16進数XXで表すLatin-1文字
\uXXXX	4桁の16進数XXXXで表すUnicode文字
\u{XXXXX}	4桁の16進数を超えるUnicode文字、ES2015より対応。

エスケープシーケンスを使ったサンプルコード

「\n」改行（ラインフィード）

改行コードは「\n」で表します。 改行が入るため、実行結果は2行ににわたって表示されます。

// 改行
console.log('hello' + '\n' + 'world');

// 実行結果-----------
hello
world

「'hello' + '\n' + 'world'」という風に文字列を別々にして連結していますが、 別々にせずに「'hello\nworld'」としても同じ結果となります。

両者を比較してみると「'hello\nworld'」よりも 「'hello' + '\n' + 'world'」の方が可読性が高くなります。

上のサンプルコードのようにエスケープシーケンスを別に記述して連結するかどうかは、 状況に応じて判断してください。

「\t」タブ文字

タブ文字は「\t」で表します。

「hello」と「world!」の間にタブ文字をいれます。

// タブ文字
console.log('hello' + '\t' + 'world!'); // hello	world!

// タブ文字
console.log('hello\tworld!'); // hello	world!

1番目も2番目も結果は同じですが、多くの方が1番目の方が見やすいかと思います。

「\'」シングルクォート

文字列全体をシングルクォートで囲っている場合、 シングルクォートは「\'」で表しますが、 文字列全体をダブルクォート(")で囲っている場合は「\'」ではなく「'」で表せます。

次のサンプルは、「hello」をシングルクォートで囲って 「'hello' world!」と出力します。

// 文字列全体をシングルクォートで囲っている場合
console.log('\'hello\' world'); // 'hello' world

// 文字列全体をダブルクォートで囲っている場合
console.log("'hello' world"); // 'hello' world

1番目は文字列全体をシングルクォート(')で囲っています。 そのため、シングルクォート(')を表す場合は「\'」とします。

一方、2番目は文字列全体をダブルクォート(")で囲っています。 そのため、エスケープシーケンスを使う必要はありません。

「\"」ダブルクォート

上のシングルクォートと考え方は同じです。

文字列全体をダブルクォートで囲っている場合、 ダブルクォートは「\"」で表しますが、 文字列全体をシングルクォート(')で囲っている場合は「\"」ではなく「"」で表せます。

次のサンプルは、「hello」をダブルクォートで囲って 「"hello" world!」と出力します。

// 文字列全体をダブルクォートで囲っている場合
console.log("\"hello\" world!");

// 文字列全体をシングルクォートで囲っている場合
console.log('"hello" world!');

1番目は文字列全体をダブルクォート(")で囲っています。 そのため、ダブルクォート(")を表す場合は「\"」とします。

一方、2番目は文字列全体をシングルクォート(')で囲っています。 そのため、エスケープシーケンスを使う必要はありません。