1. 概要(何のためにある?)
エスケープシーケンスは「文字列リテラルの中で直接書けない特殊な文字」を表すための書き方です。バックスラッシュ \ と記号を組み合わせて使います。たとえば改行・タブ・クォート(' や ")・Unicode の特殊文字などを文字列の中に入れたいときに使います。
2. よく使うエスケープ(一覧と簡単な意味)
\n:改行(new line)\t:タブ(水平タブ)\\:バックスラッシュ\自体を表す\'/\":シングル/ダブルクォートを文字として書くとき(文字列を同じ種類のクォートで囲っている場合)\`:バッククォート(テンプレートリテラル内でバッククォートを文字にしたいとき)\0:NULL(文字コード 0、値nullとは別物)\xXX:2 桁の 16 進数で Latin-1 文字を指定(例:\x48=H)\uXXXX:4 桁の 16 進数で Unicode を指定(例:\u82b1=花)\u{XXXXXX}:コードポイントで Unicode を指定。1〜6 桁の 16 進数が使える(ES6/ES2015 以降)。
// 改行とタブ
console.log("こんにちは。\n今日は\t天気がいいです。");
// 出力:
// こんにちは。
// 今日は 天気がいいです。
// クォートの内部で同じクォートを使いたいとき
console.log('Today\'s Movie'); // Today's Movie
// バックスラッシュを表示したいとき
console.log("パスは C:\\Windows\\System32"); // パスは C:\Windows\System32
// 16進や Unicode
console.log('\x48\x65\x79'); // Hey
console.log('\u82b1\u675f'); // 花束
console.log('\u{1F600}'); // 😀(絵文字:U+1F600)
// \u{...} は ES6 以降で使えるコードポイント指定です。 :contentReference[oaicite:2]{index=2}
JavaScript3. テンプレートリテラル(バッククォート)の便利な点
バッククォート(`)で囲むテンプレートリテラルはそのまま複数行を書けるので、 \n を気にせず可読性よく書けます。また ${expr} で式を埋め込めます(文字列内に変数の値を入れられる)。これらは ES6 の機能です。
const name = "花子";
const text = `こんにちは ${name} さん。
明日は晴れるといいですね。`; // ← 改行をそのまま含む
console.log(text);
JavaScriptよくある間違い・注意点(初心者がハマりやすい所)
- シングルクォートで囲んだ文字列内にそのまま
'を書くと構文エラーになる →\'を使う。 \0は「文字コード 0 の文字」であってnull(値が無い)とは別。意図せず入ると文字列長に影響します。\uXXXXは 4 桁の 16 進数しか扱えない(サロゲートが必要なコードポイントは分割される)。幅広い Unicode(絵文字など)を扱うときは\u{...}が便利。- テンプレートリテラル(バッククォート)を使えば見た目どおりに改行できるが、HTML に埋める際の扱い(空白・改行の表示)には別の注意が必要(出力先での扱いを確認すること)。
練習
次のコードの出力を予想してから実行してみる:
console.log("A\tB\nC\\D");
JavaScript"She said "Hello"" を正しく出力するにはどう書けばよいか?(単一行・シングル/ダブルどちらの書き方でも試す)
まとめ(覚えておきたいポイント)
\で始まる特殊な組み合わせが「エスケープシーケンス」。まずは\n,\t,\\,\',\"を覚えると実務で困りにくいです。- 絵文字や 16 ビットを超える Unicode を扱うなら
\u{...}を使うと安全(ES6)。 - 文字列の表現が楽になるテンプレートリテラル(バッククォート)も積極的に使おう。
