Artigo original: https://www.freecodecamp.org/news/javascript-string-format-how-to-format-strings-in-js/

O JavaScript tem muitos métodos que você pode usar para formatar strings. Neste artigo, mostrarei alguns dos métodos mais usados.

Vale ressaltar que os métodos de string toUpperCase, toLowerCase, replace e trim abaixo não alteram a string original, mas retornam uma nova string formatada de um modo específico.

Nota do tradutor: como curiosidade: o JavaScript conta as posições sempre a partir de zero, como se fosse um array de caracteres.

Como usar o método toLowerCase()

Como o nome indica, você usa o método toLowerCase() para converter strings em sua versão em letras minúsculas.

O que ele faz é pegar a string original e retornar uma nova string, toda em letras minúsculas.

Aqui temos um exemplo:

const string = "HeLLo woRld"

const lowercase = string.toLowerCase()

console.log(string)
// HeLLo woRld

console.log(lowercase)
// hello world

Como você pode ver, a nova string tem todas as letras minúsculas.

Como usar o método toUpperCase()

Parecido com o primeiro método, toUpperCase é usado para converter uma strings na sua versão em letras maiúsculas.

Aqui vemos um exemplo:

const string = "HeLLo woRld"

const uppercase = string.toUpperCase()

console.log(string)
// HeLLo woRld

console.log(uppercase)
// HELLO WORLD

Usando a string original, ele retorna uma nova string em letras maiúsculas.

Como usar o método replace()

Você usa o método replace para substituir uma parte de uma string por uma substring. Desse modo, você formatará a string para poder modificá-la.

Veja um exemplo de como o método replace funciona:

const string = "Hello world"

const modificado = string.replace("world", "developers")

console.log(string)
// Hello world

console.log(modificado)
// Hello developers

O método replace, como visto acima, substituiu a substring "world" por "developers".

Você também pode usar uma expressão regular, geralmente chamada pela abreviação Regex (por conta do inglês, Regular Expression) no lugar de uma string como substituto. Veja aqui um exemplo:

const string = "Hello world"

const modificado = string.replace(/o/g, "--")

console.log(string)
// Hello world

console.log(modificado)
// Hell-- w--rld

Usando um padrão regex para corresponder ao caractere "o" de forma global (representado pela tag g), você pode ver a string modificada contendo hifens duplos no lugar do "o" na string.

Observação: expressões regulares são escritas sem aspas.

Como usar o método trim()

O método trim modifica uma cópia da string removendo os espaços em branco do início e do fim de uma string.

Aqui está um exemplo:

const string = "  H ell  o world  "

const modificado = string.trim()

console.log(string)
//   H ell  o world 

console.log(modificado)
// H ell  o world

Você pode ver que apenas os espaços no início e no final são removidos. Os espaços entre as letras permaneceram.

Ele também considera como sendo espaço em branco as tabulações, linhas de quebra e assim por diante.

Nota do tradutor: abaixo, vemos alguns outros métodos acrescidos ao texto original.

Como usar o método repeat()

Como o nome indica, o método repeat() utiliza a string original para retornar uma nova string, repetindo-a quantas vezes você definir.

Esse é um exemplo de como utilizá-lo:

const string = "Hello World! "

const modificado = string.repeat(3)

console.log(string)
// Hello World! 

console.log(modificado)
// Hello World! Hello World! Hello World!

Como usar o método split()

Já no método split(), você utiliza o conteúdo da string original, cortando-a sempre que aparecer um caractere ou uma string que desejar, transformando-a assim em um array de substring.

Se você usar um espaço " ", como separador, a string será cortada por palavra. E caso a string separadora seja vazia "", ela separará por caractere (incluindo o espaço).

Aqui está um exemplo:

const string = "How are you doing today?"

const modificado = string.split(" ")

console.log(string)
// How are you doing today? 

console.log(modificado)
// ["How","are","you","doing","today?"]

Como usar o método concat()

O método concat() é utilizado para unir strings. Você utiliza o primeiro parâmetro para definir o caractere de união. Os outros são as strings que deseja unir à principal.

Esse método pode ser usado substituindo o operador de mais (+).

Aqui está um exemplo:

const string = "How"

const modificado = string.concat(" ","are","you","doing","today?")

const comOperador = string + " " + "are" + " " + "you" + " " + "doing" + " " + "today?"

console.log(string)
// How 

console.log(modificado)
// How are you doing today?

console.log(comOperador)
// How are you doing today?

Como extrair parte da string usando os métodos slice() substr() e substring()

Há três métodos para extrair apenas uma parte da string original. Eles são os métodos:  slice(),  substr() e  substring()

Vamos ver cada um deles!

O método slice() possui dois parâmetros, sendo eles a posição inicial, onde você quer iniciar a extração, e a posição final, onde terminá-la.

É importante lembrar que esse método captura apenas até o caractere anterior à posição final. Se um parâmetro for negativo, a posição é contada a partir do final da string.

Aqui está um exemplo de como ele funciona:

const string = "Hello World!"

const extraido = string.slice(7,12)

const negativo = string.slice(-6,-1)

console.log(string)
// Hello World! 

console.log(extraido)
// World

console.log(negativo)
// World

O método substring() possui a única diferença em relação ao slice() de que qualquer parâmetro menor que zero é tratado como zero. Desse modo, temos que:

const string = "Hello World!"

const extraido = string.substring(7,12)

const negativo = string.substring(-6)

console.log(string)
// Hello World! 

console.log(extraido)
// World

console.log(negativo)
// Hello World!

O método substr(), por sua vez, possui a diferença em relação ao slice() de que o segundo parâmetro refere-se a quantidade de caracteres capturados a partir da posição inicial.

Aqui temos um exemplo:

const string = "Hello World!"

const extraido = string.substr(7,5)

const negativo = string.substr(-6, 5)

console.log(string)
// Hello World! 

console.log(extraido)
// World

console.log(negativo)
// World

Conclusão

Existem mais alguns métodos de strings em JavaScript. Contudo, esses são os mais usados para buscas e verificações, quando há, por exemplo, uma string dentro de outra string, a localização da primeira ou da última ocorrência e assim por diante.

Saiba mais sobre métodos úteis de string no JavaScript aqui (texto em inglês).

Obrigado pela leitura e bons estudos!