JavaScript - Template Literals

Interpolation

${...}

 

 

Variable Substitutions

let firstName = "John";
let lastName = "Doe";

let text = `Welcome ${firstName}, ${lastName}!`;

 

 

 

Expression Substitution

let price = 10;
let VAT = 0.25;

let total = `Total: ${(price * (1 + VAT)).toFixed(2)}`;

Total: 12.50

 

 

 

 

HTML Templates

let header = "Templates Literals";
let tags = ["template literals", "javascript", "es6"];

let html = `<h2>${header}</h2><ul>`;
for (const x of tags) {
  html += `<li>${x}</li>`;
}

html += `</ul>`;

Templates Literals

• template literals
• javascript
• es6