DEV Community

Fernando Junior
Fernando Junior

Posted on

String

E neste terceiro post da saga de estudos em JavaScript, eu vou falar um pouco mais sobre o tipo de dados String.

Irei abordar o conceito de string e falarei sobre propriedades e métodos existentes para usar com strings.

Conceito

String é uma cadeia de caracteres, ou seja, são textos. Para representarmos textos em JavaScript, o conteúdo deve estar dentro de aspas, podendo ser aspas simples '' ou aspas duplas "". Porém, se as aspas simples for usada na abertura, o fechamento da string também deve ser realizado com a aspas simples, caso não seja, resultará em erro.

Todo conteúdo passado entre as aspas, será automaticamente convertido para string, inclusive números.

Exemplo:

let myName = 'Fernando'
console.log(myName) // Fernando
Enter fullscreen mode Exit fullscreen mode

Concatenação

Este é o nome técnico usado em situações onde uma coisa se junta a outra. No nosso caso, falaremos sobre a concatenação (junção) de strings.

Para concatenar strings, usaremos o sinal de adição +, conforme demonstro abaixo.

let firstName = 'Nathan'
let lastName = 'Drake'

let fullName = firstName + lastName

console.log(fullName) // NathanDrake
Enter fullscreen mode Exit fullscreen mode

Vendo o código acima, fica notório que falta um espaçamento entre o firstName e o lastName, fazendo com que o nome impresso ficasse junto.

Para adicionar este espaçamento, precisamos concatenar uma string com um espaço vazio entre as duas variáveis, conforme código abaixo:

let firstName = 'Nathan'
let lastName = 'Drake'

let fullName = firstName + ' ' + lastName

console.log(fullName) // Nathan Drake
Enter fullscreen mode Exit fullscreen mode

Acessando caracteres

É possível ter acesso a cada um dos caracteres de uma string. Utilizando o nome da variável que armazena a string e no final utilizando [index], sendo o index referente a posição do caractere na string, vide exemplo abaixo:

Uma importante observação, o JavaScript é uma linguagem de programação zero based, com isso, a contagem começa no número 0 e não no número 1.

const fullName = 'Nathan Drake'

console.log(fullName[0]) // N
console.log(fullName[1]) // a
console.log(fullName[2]) // t
console.log(fullName[3]) // h
console.log(fullName[4]) // a
console.log(fullName[5]) // n
Enter fullscreen mode Exit fullscreen mode

Comprimento de uma string

Existe uma propriedade usada nas strings que nos retorna o número de caracteres presente nela, vale ressaltar que os espaços em branco também contam como caractere.

Para saber o comprimento da string, utilizaremos a propriedade length.

const fullName = 'Nathan Drake'
console.log(fullName.length) // 12
Enter fullscreen mode Exit fullscreen mode

Existem outras propriedades, para saber mais, acesse

Métodos de Strings

Métodos são funções associadas a strings.

Métodos devem ser invocados, especificando parênteses ao final do nome do método.

Existem métodos que modificam o valor original da string e métodos que fazem apenas uma cópia e atribuem o resultado a outra variável.

toUpperCase

Esse método faz com que todos os caracteres da string passem a ter letras maiúsculas.

const name = 'Nathan Drake'
console.log(name) // Nathan Drake

const nameUpper = name.toUpperCase()
console.log(nameUpper) // NATHAN DRAKE
Enter fullscreen mode Exit fullscreen mode

toLowerCase

Esse método faz com que todos os caracteres da string passem a ter letras minúsculas.

const name = 'Nathan Drake'
console.log(name) // Nathan Drake

const nameLower = name.toLowerCase()
console.log(nameLower) // nathan drake
Enter fullscreen mode Exit fullscreen mode

Métodos com argumentos

Existem métodos que esperam receber algum ou alguns valores na sua execução, esses valores são informados dentro dos parênteses de invocação do método e recebem o nome de argumentos.

indexOf

Este método irá encontrar a posição (index), do caractere passado como argumento e irá retornar esse index.

const myEmail = 'fernando@email.com'

const index = myEmail.indexOf('@')

console.log(index) // 8
Enter fullscreen mode Exit fullscreen mode

lastIndexOf

Este método obtém o índice (index) da última ocorrência do item que for passado como argumento.

const email = 'laracroft@email.com'

const lastIndexOfA = email.lastIndexOf('a')

console.log(lastIndexOfA) // 12
Enter fullscreen mode Exit fullscreen mode

slice

Este método é usado para fatiar, pegar um determinado pedaço de uma string.

Este método recebe dois argumentos:

  • 1: O número que representa o index do caractere a partir do qual essa parte da string deve ser pega;
  • 2: O número que representa o index do caractere a partir do qual a string deve ser cortada;
const email = 'laracroft@email.com'

const emailSlice = email.slice(0, 9)

console.log(emailSlice) // laracroft

const emailSliceLara = email.slice(0, 4)

console.log(emailSliceLara) // lara

const emailSliceCroft = email.slice(4, 9)

console.log(emailSliceCroft) // croft
Enter fullscreen mode Exit fullscreen mode

replace

Este método é usado para substituir um caractere de uma string por outro caractere.

Este método recebe dois argumentos:

  • 1: Caractere que deve ser substituído;
  • 2: Caractere que irá substituir o que foi informado no primeiro argumento;

Obs: Este método substitui apenas a primeira ocorrência do caractere informado.

Obs2: Este método também é capaz de substituir palavras inteiras.

const email = 'laracroft@email.com'

const emailReplace = email.replace('@', '#')

console.log(emailReplace) // laracroft#email.com

const emailReplaceA = email.replace('a', '$')

console.log(emailReplaceA) // l$racroft@email.com

const emailReplaceWord = email.replace('laracroft', 'chun-li')

console.log(emailReplaceWord) // chun-li@email.com
Enter fullscreen mode Exit fullscreen mode

replaceAll

Este método é mais recente e foi criado para substituir todas as ocorrências de um determinado caractere na string, coisa que antes era impossível usando o método replace. Antes só era possível tal feito, através de regex.

const email = 'laracroft@email.com'

const emailReplaceAll = email.replaceAll('a', '$')

console.log(emailReplaceAll) // l$r$croft@em$il.com
Enter fullscreen mode Exit fullscreen mode

Estes são alguns métodos de strings, mas existem diversos outros.
Para conhecer mais métodos, acesse a documentação do MDN.


Esse foi mais um post da minha saga de estudos em JavaScript Vanilla. Espero que estejam gostando!

Qualquer dúvida ou sugestão, vocês me encontram nas minhas redes sociais:

LinkedIn
GIthub
Twitter

Top comments (0)