文字列

二重引用符（"）、単一引用符（'）、バッククォート（`）で囲まれている文字セット（文字、数字、記号など）は、文字列プリミティブです。このコースでは、文字列の例をいくつか確認しました。前のモジュールの console.log のインスタンスには、文字列プリミティブが含まれていました。

console.log( "Hello, World." );
> Hello, World.

"Hello, World." は文字列プリミティブです。単一引用符またはバッククォートでも同じ結果が得られます。

console.log( 'Hello, World.' );
> Hello, World.

console.log(`Hello, World.`);
> Hello, World.

引用符で囲まれた一連の文字は、文字列リテラルと呼ばれます。二重引用符と一重引用符は同じ動作をします。一方を文字列自体に文字として含めることができます。

console.log( "I'm a string." );
> I'm a string.

console.log( '"A string," I said.' );
> "A string," I said.

文字列内で同じ包含文字が使用されていると、文字列が「閉じる」ため、エラーが発生する可能性があります。

console.log( '"I'm a string," I said.' );
> Uncaught SyntaxError: missing ) after argument list

これを回避するには、バックスラッシュ（``）を使用して文字をエスケープします。

console.log( '"I\'m a string," I said.' );
> "I'm a string," I said.

文字列オブジェクト

関数として呼び出されると、String オブジェクトは指定された値を文字列リテラルに強制変換します。

let myString = String( 10 );

myString
> "10"

typeof myString
> string

プロトタイプの継承で詳しく説明されているように、String オブジェクトをコンストラクタとして使用する必要はほとんどありません。文字列リテラルではなく、String オブジェクトによってすでに提供されているメソッドとプロパティとともに、指定された値を含む文字列オブジェクトを作成します。

let stringObj = new String( "My new string." );

typeof stringObj
> object

stringObj
> String { "My new string." }

連結

数字ではなく文字列のコンテキストで使用する場合、1 つのプラス記号（+）は連結演算子として機能し、複数の文字列値を 1 つの文字列に結合します。

console.log( "My" + " string." );
> My string.

文字列リテラルとテンプレート リテラル

単一引用符、二重引用符、バッククォートは、文字列プリミティブの作成時に同じ意味で使用できます。ただし、バッククォートを使用してテンプレート リテラル（「テンプレート文字列」とも呼ばれます）を指定することもできます。単一引用符または二重引用符によって作成される文字列リテラルとは異なり、テンプレート リテラルでは複数行の文字列と文字列補間が可能です。

const myString = "This
is a string.";
> Uncaught SyntaxError: "" string literal contains an unescaped line break

const myString = `This
is a string.`;

console.log( myString );

> This
is a string.

テンプレート リテラルには、ドル記号と中かっこ（${}）でマークされたプレースホルダ式を含めることができます。これらのプレースホルダはデフォルトで「補間」され、式の結果が最終的な文字列のプレースホルダを置き換えます。

console.log( "The result is " + ( 2 + 4 ) + "." );
> The result is 6.

console.log( `The result is ${ 2 + 4 }.` );
> The result is 6.

テンプレート リテラルをカスタム関数に渡して、タグ付きテンプレートを作成できます。これは、1 つのテンプレート リテラルを引数のセットとして使用し、作成者が定義したロジックに基づいてプレースホルダを設定する関数呼び出しです。

タグ関数の最初の引数には文字列値の配列が含まれ、残りの引数はプレースホルダを定義します。この文字列値の配列は、そこに含まれる各プレースホルダでテンプレート リテラルを「分割」することで作成されます。配列の最初の要素には最初のプレースホルダまでの任意の文字が含まれ、2 番目の要素には 1 番目と 2 番目のプレースホルダの間の任意の文字が含まれます。各プレースホルダは、関連付けられたプレースホルダとともに、スタンドアロンの値としてタグ関数に渡されます。

const myNoun = "template literal";

function myTagFunction( myStrings, myPlaceholder ) {
    const myInitialString = myStrings[ 0 ];
    console.log( `${ myInitialString }modified ${ myPlaceholder }.` );
}

myTagFunction`I'm a ${ myNoun }.`;
> "I'm a modified template literal."

理解度をチェックする