ES6のテンプレート文字列の使用方法


  1. テンプレート文字列の基本的な使用方法:

    const name = 'John';
    const message = `Hello, ${name}!`;
    console.log(message); // 出力: Hello, John!

    上記の例では、${name}の部分が変数nameの値で置き換えられ、messageにはHello, John!という文字列が代入されます。

  2. 式の埋め込み:

    const a = 10;
    const b = 5;
    const result = `The sum of ${a} and ${b} is ${a + b}.`;
    console.log(result); // 出力: The sum of 10 and 5 is 15.

    上記の例では、${a + b}の部分が式a + bの結果で置き換えられ、resultにはThe sum of 10 and 5 is 15.という文字列が代入されます。

  3. 複数行のテキストの表現:

    const multilineText = `
    This is a multiline text.
    It can span multiple lines.
    `;
    console.log(multilineText);
    // 出力:
    //   This is a multiline text.
    //   It can span multiple lines.

    バッククォートで囲まれたテンプレート文字列は、複数行のテキストを表現するのに便利です。

  4. 関数の呼び出し:

    function greet(name) {
    return `Hello, ${name}!`;
    }
    console.log(greet('Alice')); // 出力: Hello, Alice!

    テンプレート文字列は関数の呼び出し結果も埋め込むことができます。

これらはテンプレート文字列の基本的な使用方法の一部です。さまざまなシナリオでテンプレート文字列を使用することで、コードの可読性や保守性を向上させることができます。