JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

JavaScriptで文字列を途中で改行するとき、バックスラッシュはどれほど重要？

JavaScriptで文字列を途中で改行（分割）する際、バックスラッシュ（\）は非常に重要な役割を果たします。バックスラッシュなしで文字列の途中に改行を入れると、JavaScriptはそのコードを正しく解釈できず、結果として何も出力されません。

これは、JavaScriptでは1つの文字列リテラルが同じ行で完結している必要があるためです。行をまたいで文字列を記述したい場合は、行末にバックスラッシュを置くことで「次の行も同じ文字列の続きである」ということをインタプリタに伝えることができます。

バックスラッシュを使わない場合：出力されない例

以下の例では、文字列の途中で改行していますが、バックスラッシュを使用していないため、画面には何も表示されません。ブラウザのコンソールには構文エラー（SyntaxError: Invalid or unexpected token）が出力されます。

<html>
<body>
<p id="backslash"></p>
<script>
    document.getElementById("backslash").innerHTML = "Javascript is   // 文字列がここで途切れている
    not java!";
</script>
</body>
</html>

バックスラッシュを使う場合：正しく表示される例

一方、行末にバックスラッシュを付けることで、JavaScriptは複数行にまたがる文字列全体を読み取り、その内容を出力として表示できるようになります。

<html>
<body>
<p id="backslash"></p>
<script>
document.getElementById("backslash").innerHTML = "Javascript is \
not java!";
</script>
</body>
</html>

出力結果

Javascript is not java!

補足：より現代的な書き方

バックスラッシュによる行継続は有効な手法ですが、現在ではテンプレートリテラル（バッククォート `` ` ``）を使う方法も広く利用されています。テンプレートリテラルなら、バックスラッシュなしで自由に改行を含められます。

document.getElementById("backslash").innerHTML = `Javascript is
not java!`;

このように、文字列を複数行に分けて記述する場合は、バックスラッシュによる行継続かテンプレートリテラルのいずれかを使うことで、エラーを回避しつつ読みやすいコードを実現できます。

  1. JavaScriptで文字列を検索する方法【search()メソッドの使い方を解説】

    JavaScriptで文字列を検索する方法 JavaScriptで文字列の中から特定の文字列を探すには、search()メソッドを使用します。このメソッドは、引数に渡した文字列（または正規表現）が対象の文字列内で最初に一致した位置（インデックス）を返し、見つからなかった場合は -1 を返します。 以下は、JavaScriptで文字列を検索するサンプルコードです。 サンプルコード <!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8" />

  2. 文字列をJavaScriptオブジェクトに変換する方法【JSON.parse()の使い方】

    JavaScriptでJSON形式の文字列をオブジェクトに変換するには、JSON.parse()メソッドを使用します。このメソッドは、引数に渡された文字列を解析（パース）し、対応するJavaScriptオブジェクトを返します。 サンプルコード <!DOCTYPE html> <html lang=ja> <head> <meta charset=UTF-8 /> <meta name=viewport content=width=device-width, initial-scale=1.0 /> <title>Docum