Maison > Article > interface Web > Partage d'exemples de chaînes de modèles ES6
Partage d'exemples de chaînes de modèles ES6
- 小云云original
- 2018-01-26 16:44:121720parcourir
Un nouveau type de syntaxe littérale de chaîne introduit dans ES6 - chaîne modèle. Techniquement expliqué, une chaîne modèle est une chaîne littérale qui intègre des expressions dans une chaîne littérale. Pour faire simple, il s’agit d’une chaîne avec une fonction variable ajoutée.
ES6 nous fournit des chaînes de modèles et la syntaxe utilise des backticks`. Les chaînes de modèles présentent les trois avantages suivants :
Texte multiligne
Insertion de variables dans des chaînes
-
Insérer des expressions dans des chaînes
Syntaxe de base
La déclaration des chaînes de modèle est la même que celle des chaînes ES5.
// ES5 var name = 'xixi'; console.log(name);// xixi // ES6 let name4ES6 = `一步`; console.log(name4ES6);// 一步
Texte multiligne
À l'époque où Jquery était populaire, nous collions souvent des fragments HTML puis remplaçons des nœuds. Écrivez un morceau de code ES5 pour que tout le monde puisse l'expérimenter :
var str = '<html>' + '<p>啦拉拉</p>' + '<p>xixixi</p>' + '</html>'; console.log(str);// <html><p>啦拉拉</p><p>xixixi</p></html>
ES6 prend en charge le texte multiligne et le code ci-dessus est beaucoup plus facile à implémenter.
let str4ES6 = `<html> <p>啦拉拉</p> <p>xixixix</p> </html>`; console.log(str4ES6);
Vous pouvez insérer des variables ou des expressions
// ES5 var name = 'xixi'; var age = 27; var info = 'my name is ' + name + ' , age is ' + age + '.'; console.log(info);// my name is xixi , age is 27.
Les chaînes de modèles ES6 sont beaucoup plus faciles à implémenter. La syntaxe clé est ${}, dans laquelle n'importe quelle expression js peut être insérée.
let name = 'xixi';
let age = 27;
let info = `my name is ${name}, my age is ${age}. just a test ${1 + 10}!`;
console.log(info);// my name is xixi, my age is 27. just a test 11!
Résumé
La chaîne de modèle ES6 est si simple et facile à utiliser.
Recommandations associées :
Explication détaillée de la conversion mutuelle entre les nombres JS et les chaînes
Une collection de méthodes couramment utilisées pour intercepter les chaînes dans JS
Comment épisser ajax json et string à l'aide de jquery
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!