Literais de modelo JavaScript
Sinônimos:
- Literais Modelo
- Strings de modelo
- Modelos de sequência
- Sintaxe Back-Tics
Sintaxe Back-Tics
Os literais de modelo usam acentos graves (``) em vez das aspas ("") para definir uma string:
Exemplo
let text = `Hello World!`;
Citações Dentro de Strings
Com literais de modelo , você pode usar aspas simples e duplas dentro de uma string:
Exemplo
let text = `He's often called "Johnny"`;
Strings de várias linhas
Os literais de modelo permitem strings de várias linhas:
Exemplo
let text =
`The quick
brown fox
jumps over
the lazy dog`;
Interpolação
Os literais de modelo fornecem uma maneira fácil de interpolar variáveis e expressões em strings.
O método é chamado de interpolação de string.
A sintaxe é:
${...}
Substituições de Variáveis
Os literais de modelo permitem variáveis em strings:
Exemplo
let firstName = "John";
let lastName = "Doe";
let text = `Welcome ${firstName}, ${lastName}!`;
A substituição automática de variáveis por valores reais é chamada de interpolação de strings .
Substituição de expressão
Os literais de modelo permitem expressões em strings:
Exemplo
let price = 10;
let VAT = 0.25;
let total = `Total: ${(price * (1 + VAT)).toFixed(2)}`;
A substituição automática de expressões por valores reais é chamada de interpolação de strings .
Modelos HTML
Exemplo
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>`;
Suporte ao navegador
Template Literals é um recurso ES6 (JavaScript 2015).
É suportado em todos os navegadores modernos:
| Chrome | Edge | Firefox | Safari | Opera |
| Yes | Yes | Yes | Yes | Yes |
Template Literals não é compatível com o Internet Explorer.
Referência de string completa
Para uma referência completa de String, acesse nosso:
Referência de string JavaScript completa .
A referência contém descrições e exemplos de todas as propriedades e métodos de string.