# ARRAY
Tags: javascript, array
Published: 2023-01-23 17:33:58

# ARRAYS

### Boas práticas | um array armazena valores que são do mesmo tipo, sequencialmente. Embora o JS permita criar arrays com tipos diferentes é altamente recomendável seguir as boas práticas de utilizar o mesmo tipo para se criar um array.

Um array é um conjunto ordenado de valores. 

Cada valor é chamado de elemento e cada elemento tem uma posição numérica no array, conhecida como índice. 

Os arrays em JavaScript são: *não tipados* : um elemento do array pode ser de qualquer  tipo e diferentes elementos do mesmo array e podem ser de tipos diferentes. 

Os elementos podem ser até objetos ou outros arrays, o que permite a criação de estruturas de dados complexas, como arrays de objetos e arrays de arrays. 

Os arrays em JavaScript são baseados em zero e usam índices de 32 bits: o índice do primeiro elemento é 0 e o índice mais alto possível é 4294967294 (232−2), para um tamanho de array máximo de 4.294.967.295 elementos. 

Os arrays em JavaScript são dinâmicos: eles crescem ou diminuem conforme o necessário e não há necessidade de declarar um tamanho fixo para o array ao criá-lo ou realocá-lo quando o tamanho muda. 

Os arrays em JavaScript podem ser esparsos: os elementos não precisam ter índices contíguos e pode haver lacunas. 

Todo array em JavaScript tem uma propriedade length. Para arrays não esparsos, essa propriedade especifica o número de elementos no array. Para arrays esparsos, length é maior do que o índice de todos os elementos.


## Criando arrays

A maneira mais fácil de criar um array é com um array literal, que é simplesmente uma lista de elementos de array separados com vírgulas dentro de colchetes. 

```jsx
`Por exemplo: 

var empty = [];                      // Um array sem elementos 

var primes = [2, 3, 5, 7, 11];      // Um array com 5 elementos numéricos | boa prática

var misc = [ 1.1, true, "a", ];    // 3 elementos de vários tipos + vírgula à direita|má pratica`
```

Os valores de um array literal não precisam ser constantes. Podem ser expressões arbitrárias:

```jsx
var base = 1024;
var table = [base, base+1, base+2, base+3];
```

Os array literais podem conter objetos literais ou outros array literais:

```jsx
var b = [[1,{x:1, y:2}], [2, {x:3, y:4}]];
```

## INSERINDO UM ELEMENTO NO ***FINAL*** DO ARRAY

Se quisermos acrescentar um novo elemento nesse array (por exemplo o numero 10), tudo que precisamos fazer é referenciar a última posição livre do array e atribuir-lhe um valor.

> Em JavaScript, array é um objeto mutável. Podemos facilmente lhe acrescentar novos elementos. O objeto crescerá dinamicamente á medida que novos elementos forem adicionados.
> 

```jsx
// inserindo elemento no final do array

let numbers = [0,1,2,3,4,5,6,7,8,9]

numbers [numbers.length] = 10

console.log (numbers) // saida : [0,1,2,3,4,5,6,7,8,9,10]
```

## INSERINDO UM ELEMENTO NA ÚLTIMA POSIÇÃO [push]

A API de JavaScript também tem um método chamado ***`push`*** que nos permite acrescentar novos elementos no final de um array. Podemos acrescentar quantos elementos quisermos como argumentos no método `***push***`

```jsx
//***push*** que nos permite acrescentar novos elementos no final de um array

let numbers = [0,1,2,3,4,5,6,7,8,9,10]

numbers.push(11)
numbers.push (35)

console.log (numbers) // saída : [0,1,2,3,4,5,6,7,8,9,10,11,35]
```

## ISERINDO UM ELEMENTO NA PRIMEIRA POSIÇÃO [unshift]

Agora vamos adicionar mais um elemento no array, só que agora na primeira posição [-1], basta utilizar o método `***unshift***`

```jsx
//*unshift *****que nos permite acrescentar novos elementos no começo de um array

let numbers = [0,1,2,3,4,5,6,7,8,9,10,11,35]

numbers.unshift(-1)
numbers.unshift(-2)
console.log(numbers) // saída : [-2,-1,0,1,2,3,4,5,6,7,8,9,10,11,35]
```

## REMOVENDO UM ELEMENTO DO FINAL DO ARRAY [pop]

Para remover um elemento do final de array, basta utilizar o método `***pop***`

```jsx
// ***pop*** que nos permite remover o último elemento de um array

let numbers = [-2,-1,0,1,2,3,4,5,6,7,8,9,10,11,35]

numbers.pop();        // não precisa inserir nenhum valor
console.log(numbers) // saída : [-2,-1,0,1,2,3,4,5,6,7,8,9,10,11]

 // para saber qual elemento foi retirado é simples, basta jogar o 'numbers.pop' dentro de uma
//  variavel

let removidos = numbers.pop();
console.log(removed) // saída : [35]
```

## REMOVENDO UM ELEMENTO DO INÍCIO DO ARRAY [shift]

Para remover um elemento do início de array, basta utilizar o método `***shift***`

```jsx
// ***shift*** que nos permite remover o primeiro elemento de um array

let numbers = [-2,-1,0,1,2,3,4,5,6,7,8,9,10,11]

numbers.shift();        // não precisa inserir nenhum valor
console.log(numbers) // saída : [-1,0,1,2,3,4,5,6,7,8,9,10,11]

 // para saber qual elemento foi retirado é simples, basta jogar o 'numbers.pop' dentro de uma
//  variavel

let removed = numbers.shift();
console.log(removed) // saída : [-2]
```

## ADICIONANDO E REMOVENDO ELEMENTOS DE UMA POSIÇÃO ESPECIFICA [splice]

O método `splice` pode ser usado para remover um elemento de um array, simplesmente especificando a posição / índice a partir do qual queremos fazer a remoção e a quantidade  de elementos que gostaríamos de remover, assim:

> MUITO IMPORTANTE O PRIMEIRO ITEM DO  `numbers.splice(2,3)`  `(2)` REMOVE A PARTIR DESTE INDICE
> 

> POR ISSO A REMOÇÃO COMEÇOU DO `[ -1 ]` E A ACABOU COM O NUMERO DE ITEM `(3)` ACIMA
> 

```jsx
// ***splice*** que nos permite remover um elemento em especifico do elemento de um array

let numbers = [-2,-1,0,1,2,3,4,5,6,7,8,9,10,11,35]

numbers.splice(2,3); // o primeiro elemento (2) vai acessar o indice do array
									  // o segundo elemento (3) vai ser a quantidade de itens que vc quer remover

console.log(numbers) // saída : [-2,-1,3,4,5,6,7,8,9,10,11,35]

 // para saber qual elemento foi retirado é simples, basta jogar o 'numbers.splice' dentro de uma
//  variavel
let removidos = numbers.splice(2,3);
console.log(removed) // saída : [0, 1, 2]
```

### Para ***inserir*** novamente os números de volta utilizamos o `splice` novamente

> MUITO IMPORTANTE PARA INSERIR NOVAMENTE OS ELEMENTOS A PARTIR DO `[0]` A CONTAGEM COMEÇOU A PARTIR DO ELEMENTO `(2)` E O NUMEROS VAI SER INSERIDOS DEPOIS DO `[-1]`
> 

```jsx
// ***splice*** que nos permite diconar um elemento em especifico no elemento de um array

let numbers = [-2,-1,4,5,6,7,8,9,10,11,35]

numbers.splice(2,0,1,2,3); 
// o primeiro elemento (3) vai acessar o indice do array
// o segundo elemento (0) vai ser a quantidade de itens que vc quer remover
// a partir do elemento (0) vai ser os elementos que vc quer inserir (1,2,3)

console.log(numbers) // saída : [-2,-1,0,1,2,3,4,5,6,7,8,9,10,11]

 // para saber qual elemento foi retirado é simples, basta jogar o 'numbers.splice' dentro de uma
//  variavel
let removidos = numbers.splice(2,3);
console.log(removed) // saída : [0, 1, 2]
```

# ARRAYS BIDIMENSIONAIS ?????? PROCURAR

# MÉTODOS ARRAYS

***CONCAT*** - Junta vários arrays e devolve uma cópia dos arrays concatenados.

```jsx
let a = [1,2,3,4,5];

let b = [7,8,9,10];

const numbers = a.concat(b);

console.log(numbers) // saida : [1,2,3,4,5,7,8,9,10]
```

***EVERY*** - Itera por todos os elementos do array, verificando uma condição desejada (função) até que ‘false’ seja devolvido ( verifica se passa no teste e da um resultado booleano)

```jsx
let a = [1,2,3,4,5];

let b = [7,8,9,10];

const resultado = (a) => a > 2; // condição boolean

console.log(resultado(a [2])) // saída : true ( 3 é > 2)
```

***FILTER*** - Filtra elementos específicos que você quer que esteja em um lista com determinados critérios.

```jsx
let names =  [
    'Furia',
    'Navi',
    'Luminosity',
    'Fnatic',
    'Liquid',
    'North',
    'G2',
    'NZXT',
]
												// o 'name' dentro da função é o nome de uma variavel e você pode colocar
											 // o nome que vc quiser
const times = names.filter((name) => name.startsWith('N')) // função para saber que times começam
																													 //  com a letra 'N'

console.log(filtro) // saída : [ 'Navi', 'North', 'NZXT' ]
```

***FOREACH*** - O método `forEach` do JavaScript é uma de várias maneiras de percorrer arrays.

O método forEach é usado para percorrer arrays, mas usa uma função de modo diferente do "laço for" tradicional.

O método forEach passa uma função de [callback](https://www.freecodecamp.org/news/javascript-callback-functions-what-are-callbacks-in-js-and-how-to-use-them/) para cada elemento do array juntamente aos seguintes parâmetros:

- Valor atual (obrigatório) - O valor do elemento atual do array
- Índice (opcional) - O número do índice do elemento atual
- Array (opcional) - O objeto de array ao qual o elemento atual pertence

> Como alternativa, você pode usar uma representação de arrow function do ES6 para simplificar o código:
> 
> 
> `numbers.forEach(number => console.log(number));`
> 

```jsx
let numbers = [1,2,3,4,5] 

									 // o 'numbers' dentro da função é o nome de uma variavel e você pode colocar
									// o nome que vc quiser
const numerosExemplo = numbers.forEach (numbers => console.log(numbers)) // saída : 1,2,3,4,5
```

***JOIN*** - Junta todos o elementos do array em uma string 

```jsx
let juntandoNome = ['Jhonatan', 'Marques', 'dos', 'Santos'] 

const retornoNome = juntandoNome.join('-') // paramentro que eu quero entre os nomes

console.log(retornoNome) // saída : Jhonatan-Marques-dos-Santos
```

***INDEXOF*** - Pesquisa o array em busca de elementos específicos e devolve a sua posição. (case-sensitive)

> Quando aparecer -1 no console é porque o texto não existe nos parâmetros buscados
> 

```jsx
let juntandoNome = ['Jhonatan', 'Marques', 'dos', 'Santos'] 

console.log(juntandoNome.indexOf('Marques')) // saída : '1' : pois esse é o numero 
																						//  do índice que esta a palavra 'Marques'
```

***LASTINDEXOF*** - Devolve o índice da ultima posição que corresponda ao critério de pesquisa.

(case-sensitive)

```jsx
let juntandoNome = ['Jhonatan', 'Marques', 'dos', 'Santos'] 

const teste = juntandoNome.lastIndexOf('Santos')

console.log(teste) // saída : 3 : pois esse é o numero do índice que esta a palavra 'Santos'
```

***MAP***  - (importante para o react) - Criar outro array a partir de uma função que contém o critério/condição e devolve os elementos do array que corresponde o critério/condição.

```jsx
let numbers = [1,2,3,4,5]

													// 'number' nome qualquer para a variavel
let multiplica = numbers.map ((number)=> number * 2)

// nessa função irá ser multiplicado os numeros dentro do array '[1,2,3,4,5]' 
// e retornar um nome array com o resultado [ 2, 4, 6, 8, 10 ]

console.log(multiplica) // saída : [ 2, 4, 6, 8, 10 ]
```

***SORT*** - Classifica os elementos em ordem alfabética crescente 

> Serve somente para strings
> 

```jsx
let times = [
    'Luminosity',
    'Sk',
    'Navi',
    'Liquid',
    'Outsiders',
    'Vitality',
    'Astralis'
]

const ordemAlfabética = times.sort()

console.log(ordemAlfabética) 
/* saída :
[
  'Astralis',
  'Liquid',
  'Luminosity',
  'Navi',
  'Outsiders',
  'Sk',
  'Vitality'
]
```

***REVERSE*** - Reverte os elementos, os  últimos elementos serão os primeiros

```jsx
let times = [
    'Luminosity',
    'Sk',
    'Navi',
    'Liquid',
    'Outsiders',
    'Vitality',
    'Astralis'
]

const ordemAlfabética = times.reverse()

console.log(ordemAlfabética)
 /* saída :
  [ 'Astralis',
	  'Vitality',
	  'Outsiders',
	  'Liquid',
	  'Navi',
	  'Sk',
	  'Luminosity' ]
```

***SLICE*** - Corta o array com o numero de índice especificado

```jsx
let times = [
    'Luminosity',
    'Sk',
    'Navi',
    'Liquid',
    'Outsiders',
    'Vitality',
    'Astralis'
]

						// indice especificado (2,-1)
						// inicial(2) quando positivo lido da esquerda p/ direita 
						//final(-1)  quando negativo lido da direita p/ esquerda
const ordemAlfabética = times.slice(2,-1)

console.log(ordemAlfabética)

// saída : [ 'Navi', 'Liquid', 'Outsiders' ]

```

***SOME*** - Itera por todos os elementos do array, verificando a condição desejada (função) até que `true` seja devolvido.

***SORT*** - Organiza o array em ordem alfabética ou de acordo com a função especificada.

```jsx
let times = [
    'Luminosity',
    'Sk',
    'Navi',
    'Liquid',
    'Outsiders',
    'Vitality',
    'Astralis'
]

times.sort();

console.log(times) 
// saída : 
[ 'Astralis',
  'Liquid',
  'Luminosity',
  'Navi',
  'Outsiders',
  'Sk',
  'Vitality'
]
```

***TO STRING*** - Devolve o array em forma de uma string.

```jsx
let times = [ 1, 2, 3, 4, 5 ]

times.toString();

console.log(times) // saída : o array tipo number sai como string [ 1, 2, 3, 4, 5 ]
```

###Esses são apenas alguns tipos e possibilidades de se trabalhar com os arrays.