String
Published: 2021-03-05 00:23:34

E neste terceiro post da [saga de estudos](https://dev.to/inando85/bem-vindo-de-novo-javascript-1b48) 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:

```js
let myName = 'Fernando'
console.log(myName) // Fernando
```
#### 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.

```js
let firstName = 'Nathan'
let lastName = 'Drake'

let fullName = firstName + lastName

console.log(fullName) // NathanDrake
```

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:

```js
let firstName = 'Nathan'
let lastName = 'Drake'

let fullName = firstName + ' ' + lastName

console.log(fullName) // Nathan Drake
```

#### 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.


```js
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
```

#### 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`.

```js
const fullName = 'Nathan Drake'
console.log(fullName.length) // 12
```

Existem outras propriedades, para saber mais, [acesse](https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Global_Objects/String#properties)

### 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.

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

const nameUpper = name.toUpperCase()
console.log(nameUpper) // NATHAN DRAKE
```

#### toLowerCase

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

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

const nameLower = name.toLowerCase()
console.log(nameLower) // nathan drake
```

### 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.

```js
const myEmail = 'fernando@email.com'

const index = myEmail.indexOf('@')

console.log(index) // 8
```

#### lastIndexOf

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

```js
const email = 'laracroft@email.com'

const lastIndexOfA = email.lastIndexOf('a')

console.log(lastIndexOfA) // 12
```

#### 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;

```js
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
```

#### 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.

```js
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
```

#### 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`.

```js
const email = 'laracroft@email.com'

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

console.log(emailReplaceAll) // l$r$croft@em$il.com
```

Estes são alguns métodos de strings, mas existem diversos outros.
Para conhecer mais métodos, [acesse](https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Global_Objects/String#m%C3%A9todos) 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](https://linkedin.com/in/inando85)
[GIthub](https://github.com/inando85)
[Twitter](https://twitter.com/inando85)