Javascript Modelo Literais

Um novo elemento adicionado no ES6 é o modelo literal. É um novo tipo para criar strings no JavaScript que adiciona vários novos recursos importantes, como a capacidade de criar strings de várias linhas e incluir uma expressão em uma string. Como desenvolvedor, todos esses recursos podem aprimorar suas habilidades para manipular strings e permitir que você crie strings dinâmicos.

Esta postagem ilustrará literais de modelo e como usá -los em javascript.

O que são literais de modelo JavaScript (Strings de modelo)?

““Literais de modelo"São comumente conhecidos como"Strings de modelo”. Eles estão cercados pelo backtick (““) personagem, em comparação com as cotações em strings. Seus espaços reservados são indicados pelo sinal do dólar “$”, E aparelho encaracolado como "$ expressão”É aceitável em literais de modelo. Se você quiser usar uma expressão, pode colocá -la no “$ expressão”Caixa dentro dos backsticks.

Um modelo literal é uma versão aprimorada de uma string javascript padrão. As substituições fazem uma distinção significativa entre um modelo literal e uma corda comum. Você pode integrar variáveis ​​e expressões em uma string usando substitutos. Essas variáveis ​​e expressões terão seus valores substituídos automaticamente pelo mecanismo JavaScript.

Sintaxe

Use a sintaxe abaixo para declarar uma única string usando literais de modelo:

'Texto da string'

Para várias linhas, siga a sintaxe dada:

'Linha de texto da string 1
linha de texto da string

Se você deseja adicionar expressão dentro dos backsticks, a seguinte sintaxe é usada:

'Texto da string $ Expression String Text'

Confira os exemplos a seguir para desenvolver uma melhor compreensão do conceito declarado.

Exemplo 1: Declare uma string de linha única usando literais de modelo JavaScript

Geralmente, para criar uma string, é necessário usar uma única ou dupla citações, mas em literais de modelo, você pode criar uma string da seguinte forma:

console.log ('linuxhint');

A saída mostra que funciona da mesma forma como a simples criação de picadas com a ajuda de citações únicas ou duplas:

Exemplo 2: Declare string multi-line usando literais de modelo JavaScript

Normalmente, para imprimir várias linhas, usamos o operador de concatenação (+) e para adicionar uma nova linha (\ n) pode ser utilizada, que geralmente pode tornar o complexo de código:

console.log ("Bem -vindo ao Linuxhint.\ n " +" O melhor site para habilidades de aprendizado.");

Enquanto estiver usando literais de modelo, você pode iniciar uma nova linha pressionando Enter do teclado no bloco de backsticks:

console.log ('Bem -vindo ao Linuxhint.
O melhor site para habilidades de aprendizado.');

Saída

Exemplo 3: String com substituições de expressão

Aqui, primeiro criaremos duas variáveis ​​“x" e "y", Com os valores"20" e "15”, Respectivamente:

var x = 20;
var y = 15;

Em seguida, crie uma variável “soma"Para adicionar o"x" e "y”:

var sum = x + y;

Se você deseja adicionar dois números e exibir a soma desses números no console, normalmente, é necessário concatenar as cordas e variáveis ​​em formato de string regular que geralmente cria uma bagunça para usar citações únicas ou duplas repetidamente com as cordas e se juntar a elas entre si e com as variáveis ​​usando (+):

console.log ("soma de x" + x + "e" + y + "é" + soma);

Enquanto, usando os literais do modelo, você só precisa especificar as cordas com variáveis ​​como uma expressão dentro do “$ ”No backtick Block:

console.log ('soma de x $ x e y $ y é $ sum');

Saída

Reunimos todas as informações essenciais relacionadas aos literais do modelo.

Conclusão

““Literais de modelo", também conhecido como "Strings de modelo”, É uma versão aprimorada de uma sequência JavaScript padrão cercada pelo backtick (““) personagem, em comparação com as cotações em strings. Ele permite a criação de strings de linha única e de várias linhas sem o uso do operador de concatenação e inclui uma expressão em uma string. Este post discutiu literais de modelo em JavaScript com exemplos explicados.