JavaScript テンプレート リテラルに値ではなく変数名が表示されるのはなぜですか?

JavaScript のテンプレート リテラル: バッククォートが必要

JavaScript のテンプレート リテラルは、文字列内の ${} プレースホルダーで示され、式を埋め込みます。ただし、バックティック (`) の代わりに一重引用符 (') を使用したテンプレート リテラルで表示の問題が発生するのは、よくある見落としです。

問題の説明

一重引用符を使用する場合、値の代わりにリテラル変数名が出力されます。例:

console.log('categoryName: ${this.categoryName}\ncategoryElements: ${this.categoryElements} ');

出力:

${this.categoryName}
categoryElements: ${this.categoryElements}

ソリューション

JavaScript テンプレート リテラル バッククォートが必要、ストレートではありません引用符。

バッククォートは次の文字ですQWERTY キーボードの「1」キーに対応します。一重引用符の代わりにこれらを使用すると、テンプレート リテラルが作成され、式を評価するための ${} プレースホルダーを格納できます:

categoryName = "name";
categoryElements = "element";
console.log(`categoryName: ${this.categoryName}\ncategoryElements: ${categoryElements} `);

出力:

categoryName: name 
categoryElements: element

追加情報

バックティックはさまざまなプログラミング言語で頻繁に使用されますが、JavaScript 開発者にとっては珍しいかもしれません。詳細については、次のリソースを参照してください:

• [JavaScript でのバックティック文字の使用](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/) template_literals)

以上がJavaScript テンプレート リテラルに値ではなく変数名が表示されるのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。