Resumo da Aula Aula 02-06 da etapa Etapa 01

[peresjuliao]

Template Strings em JavaScript

Exemplo de uso de Template Strings

Usando Concatenação

const postTitle = 'É bolacha ou biscoito?';
const postAuthor = 'Matheus Saad';
const postComments = 15;

const postMessage = 'O post "' + postTitle + '" do ' + postAuthor + ', tem ' + postComments + ' comentários.';
console.log('Usando concatenação:');
console.log(postMessage);

Um dos grandes problemas de usar concatenação é que o código fica difícil de ler. Para apresentar aspas simples dentro de uma string, use aspas duplas, e vice-versa. Esse é o grande problema de usar concatenação.

Usando Template Strings

const postMessageTemplate = `O post "${postTitle}" do ${postAuthor}, tem ${postComments} comentários.`;
console.log('Usando template strings:');
console.log(postMessageTemplate);

Criando Templates HTML

const html = `
  <h2>${postTitle}</h2>
  <p>Autor: ${postAuthor}</p>
  <span>Este post tem ${postComments} comentários</span>
`;
console.log('Usando template strings para criar templates HTML:');
console.log(html);

Observações

• Template strings são strings que permitem expressões embutidas.
• Elas facilitam a inclusão de variáveis e expressões dentro de strings.
• A criação de templates HTML se torna mais simples e legível usando template strings.