JavaScriptのエスケープシーケンスの使い方をマスターしよう
先生と生徒の会話形式で理解しよう
生徒
「先生、JavaScriptで文字列に改行やタブを入れたいときはどうすればいいですか?」
先生
「その場合はエスケープシーケンスを使います。特殊な文字を文字列の中で表す方法ですね。」
生徒
「エスケープシーケンスって聞いたことがありますが、具体的にはどんなものですか?」
先生
「文字列の中で普通に入力できない記号や特殊文字を、\\(バックスラッシュ)と組み合わせて書く方法です。順を追って説明しますね。」
1. エスケープシーケンスとは?
エスケープシーケンスとは、文字列の中で特別な動作をする文字のことです。
文字列内で「改行」「タブ」「引用符」などを正しく表示させたいときに使います。
JavaScriptでは、バックスラッシュ(\)の後に特定の文字を書くことで表現します。
2. 代表的なエスケープシーケンス
主なエスケープシーケンスをいくつか紹介します。
\n: 改行を表します\t: タブ(空白)を表します\\: バックスラッシュ自体を表示します\": ダブルクオート(")を文字列内で使うとき\': シングルクオート(')を文字列内で使うとき
3. 改行やタブを文字列に挿入する例
改行やタブは文章や表を整えるときに便利です。 例えば、次のように使えます。
const message = "こんにちは\nJavaScriptの世界へようこそ!";
console.log(message);
const tabMessage = "名前:\t太郎\n年齢:\t20歳";
console.log(tabMessage);
こんにちは
JavaScriptの世界へようこそ!
名前: 太郎
年齢: 20歳
4. クオートを文字列内で使う
文字列をシングルクオートやダブルクオートで囲んでいる場合、同じ種類のクオートを文字列内で使いたいときにエスケープが必要です。
// ダブルクオートで囲んだ文字列内にダブルクオートを使う
const quote = "彼は言いました: \"こんにちは!\"";
console.log(quote);
// シングルクオートで囲んだ文字列内にシングルクオートを使う
const singleQuote = 'It\'s a sunny day.';
console.log(singleQuote);
彼は言いました: "こんにちは!"
It's a sunny day.
5. バックスラッシュ自体を表示する
バックスラッシュはエスケープ文字として使われるため、そのまま表示したいときは二重に書きます。
const path = "C:\\Users\\Taro\\Documents";
console.log(path);
C:\Users\Taro\Documents
6. エスケープシーケンスを使った応用例
エスケープシーケンスは、長い文章や複数行のメッセージ、ログ出力、HTML文字列など、文字列を整えるときに非常に便利です。
const html = "<div class=\"card\">\n\t<p>こんにちは!</p>\n</div>";
console.log(html);
<div class="card">
<p>こんにちは!</p>
</div>
このように、エスケープシーケンスを覚えておくと、文字列を自由にコントロールできるようになります。