Fazer Interpolação de Strings em JavaScript

Kirill Ibrahim 12 outubro 2023
Fazer Interpolação de Strings em JavaScript

O JavaScript tem uma grande característica chamada interpolação de string que lhe permite injectar uma variável, uma chamada de função, e uma expressão aritmética directamente numa string.

Neste artigo, vamos introduzir como fazer a interpolação de strings. Teremos exemplos de código abaixo, que poderá executar na sua máquina.

Utilize uma nova funcionalidade do ES6 para fazer a interpolação de strings em JavaScript

Antes do lançamento do ES6, a interpolação de strings não estava disponível em JavaScript. A falta desta funcionalidade levou a um código de concatenação de strings, como se mostra abaixo.

Exemplo:

const generalInformation = (firstName, lastName, Country) => {
  return 'First Name ' + firstName + ' Last Name: ' + lastName + '. ' +
      Country + ' is my country.';
} console.log(generalInformation('Mark', 'John', 'US'));

Resultado:

First Name Mark Last Name: John. US is my country.

A interpolação de strings é uma característica que permite injectar variáveis, chamadas de funções, e expressões aritméticas directamente numa string sem utilizar caracteres de concatenação ou de fuga para strings de várias linhas.

Utilizamos backticks para modelos literais na interpolação de strings e utilizamos o formato - ${ourValue} para inserir valores dinâmicos como variáveis, chamadas de função e expressões aritméticas.

Exemplo:

const generalInformation = (firstName, lastName, Country) => {
  return `First Name: ${firstName} Last Name: ${lastName}. Country: ${Country}`;
} console.log(generalInformation('Mark', 'John', 'US'));

Resultado:

First Name: Mark Last Name: John. Country: US

Sabemos agora como a interpolação de strings é uma característica fantástica

Exemplo:

Vamos injectar uma chamada de função e uma expressão aritmética.

const generalInformation = (firstName, lastName, Country) => {
  return `First Name: ${firstName} Last Name: ${lastName}. Country: ${Country}`;
} console.log(generalInformation('Mark', 'John', 'US'));

console.log(`${generalInformation("Mark", "John", "US")} He is a Worker in our company.`);  

console.log(`sum of 10 and 6 is ${10+6}.`); 

Resultado:

First Name: Mark Last Name: John. Country: US
First Name: Mark Last Name: John. Country: US He is a Worker in our company.
sum of 10 and 6 is 16.

Exemplo:

Podemos usar declarações condicionais na interpolação de strings.

const isEvenOrOdd = (num) => {
  console.log(`Number is ${num % 2 === 0 ? 'even' : 'odd'}`);
} isEvenOrOdd(5);
isEvenOrOdd(8);

Resultado:

Number is odd
Number is even

Artigo relacionado - JavaScript String