Maison > interface Web > js tutoriel > Pourquoi les littéraux de mon modèle JavaScript affichent-ils les noms de variables au lieu des valeurs ?

Pourquoi les littéraux de mon modèle JavaScript affichent-ils les noms de variables au lieu des valeurs ?

Patricia Arquette
Libérer: 2024-12-08 05:56:09
original
315 Les gens l'ont consulté

Why Do My JavaScript Template Literals Display Variable Names Instead of Values?

Modèles littéraux en JavaScript : backticks requis

Les modèles littéraux en JavaScript, désignés par des espaces réservés ${} dans les chaînes, offrent un moyen pratique de intégrer des expressions. Cependant, rencontrer des problèmes d'affichage avec les littéraux de modèles utilisant des guillemets simples (') au lieu de guillemets (`) est un oubli courant.

Description du problème

Lors de l'utilisation de guillemets simples, les noms littéraux des variables sont imprimés à la place de leurs valeurs. Par exemple :

console.log('categoryName: ${this.categoryName}\ncategoryElements: ${this.categoryElements} ');
Copier après la connexion

Sortie :

${this.categoryName}
categoryElements: ${this.categoryElements}
Copier après la connexion

Solution

Les littéraux de modèle JavaScript nécessitent des backticks, pas directement guillemets.

Les backticks sont les caractères à côté du Touche « 1 » sur un clavier QWERTY. Leur utilisation au lieu de guillemets simples crée un modèle littéral, qui peut ensuite héberger des espaces réservés ${} pour évaluer les expressions :

categoryName = "name";
categoryElements = "element";
console.log(`categoryName: ${this.categoryName}\ncategoryElements: ${categoryElements} `);
Copier après la connexion

Sortie :

categoryName: name 
categoryElements: element
Copier après la connexion

Informations supplémentaires

Les backticks sont fréquemment utilisés dans divers langages de programmation, mais peuvent être nouveaux pour les développeurs JavaScript. Reportez-vous à la ressource suivante pour plus de détails :

  • [Utilisation du caractère Backtick en JavaScript](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/ template_literals)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal