Un nouvel élément ajouté dans ES6 est le modèle littéral. Il s'agit d'un nouveau type de création de chaînes en JavaScript qui ajoute plusieurs nouvelles fonctionnalités importantes, telles que la possibilité de créer des chaînes multilignes et d'inclure une expression dans une chaîne. En tant que développeur, toutes ces fonctionnalités peuvent améliorer vos capacités de manipulation de chaînes et vous permettre de créer des chaînes dynamiques.
Cet article illustrera les littéraux de modèle et comment les utiliser en JavaScript.
Que sont les littéraux de modèle JavaScript (chaînes de modèle) ?
' Modèles littéraux » sont communément appelés « Chaînes de modèle ”. Ils sont entourés du backtick ( ' ), par rapport aux guillemets dans les chaînes. Ses espaces réservés sont indiqués par le signe dollar ' $ ”, et accolades {} Comme ' ${expression} ” est acceptable dans les littéraux de modèle. Si vous voulez utiliser une expression, vous pouvez la mettre dans le ' ${expression} ” case à l'intérieur des backticks.
Un littéral de modèle est une version améliorée d'une chaîne JavaScript standard. Les substitutions font une distinction significative entre un modèle littéral et une chaîne ordinaire. Vous pouvez intégrer des variables et des expressions dans une chaîne à l'aide de substituts. Ces variables et expressions verront leurs valeurs automatiquement remplacées par le moteur JavaScript.
Syntaxe
Utilisez la syntaxe ci-dessous pour déclarer une seule chaîne à l'aide de littéraux de modèle :
` texte de chaîne `
Pour plusieurs lignes, suivez la syntaxe donnée :
` ligne de texte de chaîne 1
ligne de texte de chaîne
Si vous souhaitez ajouter une expression à l'intérieur des backticks, la syntaxe suivante est utilisée :
Consultez les exemples suivants pour développer une meilleure compréhension du concept énoncé.
Exemple 1 : Déclarer une chaîne de caractères sur une seule ligne à l'aide de littéraux de modèle JavaScript
Habituellement, pour créer une chaîne, il est nécessaire d'utiliser des guillemets simples ou doubles, mais dans les littéraux de modèle, vous pouvez créer une chaîne comme suit :
console.log ( ` LinuxHintGenericName ` ) ;
La sortie montre que cela fonctionne de la même manière que la simple création de sting à l'aide de guillemets simples ou doubles :
Exemple 2 : Déclarer une chaîne multiligne à l'aide de littéraux de modèle JavaScript
Normalement, pour imprimer plusieurs lignes, nous utilisons l'opérateur de concaténation (+) et pour ajouter une nouvelle ligne, (\n) peut être utilisé, ce qui peut souvent rendre le code complexe :
console.log ( 'Bienvenue dans LinuxHint. \n ' + 'Le meilleur site Web pour apprendre des compétences.' ) ;
Tandis que pour utiliser des modèles littéraux, vous pouvez commencer une nouvelle ligne en appuyant sur Entrée depuis le clavier dans le bloc backticks :
Le meilleur site web pour compétences d'apprentissage. ` ) ;
Production
Exemple 3 : Chaîne avec des substitutions d'expressions
Ici, nous allons d'abord créer deux variables ' X ' et ' Oui », avec les valeurs « vingt ' et ' quinze ', respectivement:
var x = vingt ;var y = quinze ;
Ensuite, créez une variable ' somme ' pour ajouter le ' X ' et ' Oui ” :
Si vous souhaitez ajouter deux nombres et afficher la somme de ces nombres sur la console, normalement, il est nécessaire de concaténer les chaînes et les variables dans un format de chaîne régulier, ce qui crée souvent un désordre pour utiliser des guillemets simples ou doubles à plusieurs reprises avec les chaînes et les joindre entre elles et avec les variables utilisant ( + ):
Tandis qu'en utilisant les littéraux du modèle, vous n'avez qu'à spécifier les chaînes avec des variables en tant qu'expression à l'intérieur du ' ${} ' dans le bloc backtick :
Production
Nous avons rassemblé toutes les informations essentielles liées aux littéraux du modèle.
Conclusion
' Modèles littéraux ', aussi connu sous le nom ' Chaînes de modèle ”, est une version améliorée d'une chaîne JavaScript standard entourée par le backtick ( ' ), par rapport aux guillemets dans les chaînes. Il permet la création de chaînes sur une seule ligne et sur plusieurs lignes sans utiliser l'opérateur de concaténation et inclut une expression dans une chaîne. Cet article a discuté des littéraux de modèle en JavaScript avec des exemples expliqués.