Existem várias formas de percorrer um array e que pode chegar a confundir um pouco as vezes, e hoje eu vou mostrar alguns métodos para podermos percorrer um array.
Array.forEach()
o método forEach() executa uma função para cada elemento do array.
No exemplo abaixo, pra cada elemento do array a gente imprime o número + 1. Vale lembrar que o array original não sofre alteração, por isso no final quando imprimimos o array não vemos alterações
const arr = [1, 3, 5, 7, 9];
arr.forEach(num => console.log(num+1))
/** o output é uma linha pra cada elemento:
* 2
* 4
* 6
* 8
* 10
*/
console.log(arr)
// output [ 1, 3, 5, 7, 9 ]
Array.map()
o método map() retorna um novo array com o resultado da função.
Exemplo, digamos que eu queira saber o quadrado dos números dentro do array, o map() irá percorrer cada item do array efetuando a conta de cada valor e gerando um novo array com o resultado.
const arr = [1, 2, 4, 7];
const quadrado = arr.map(num => Math.pow(num, 2))
console.log(quadrado) //output: [ 1, 4, 16, 49 ]
Array.filter()
o método filter() como o próprio nome já diz, ele filtrará o array, retornando um novo array contendo apenas os valores coincidentes com a condição
const arr = [2, 4, 7, 6, 9];
const par = arr.filter(num => num % 2 === 0)
console.log(par) //output: [ 2, 4, 6 ]
Array.find()
O método find() irá retornar o valor do primeiro elemento que satisfazer a condição
caso não ache, retornará undefined
const arr = [10, 18, 14, 16, 20];
const maior = arr.find(num => num > 15 )
console.log(maior) //output: 18
console.log(arr.find(num => num > 100 ))
//output: undefined
Array.some()
O método some() retorna um booleano. Ele verifica se pelo menos um elemento satisfaz a condição. Assim que achar um, já para e retorna true. Se chegar no final sem achar nenhum, retorna false.
const arr = [
{ nome: 'Enrique', idade: 21 },
{ nome: 'Isa', idade: 10 },
{ nome: 'Eloah', idade: 16 },
]
arr.some(pessoa => {
const condition = pessoa.idade < 18
console.log(`${pessoa.nome} tem menos que 18 anos? ${condition}`)
return condition
})
/** output
*
* Enrique tem menos que 18 anos? false
* Isa tem menos que 18 anos? true <- Achou um menor que 18 e já para
*/
Array.every()
O método every() igual ao some() também retorna um booleano, porém ele só retorna true se TODOS os elementos satisfizerem a condição. Basta um falhar que ele já para e retorna false.
Pegando o array do exemplo do some() vamos verificar se todas as pessoas são maiores ou iguais a 18 anos.
No exemplo abaixo ele retornará false porque a Isa tem 10 anos, e como ela já falha na condição, a Eloah nem chega a ser verificada.
arr.every(pessoa => {
const condition = pessoa.idade >= 18
console.log(`${pessoa.nome} é maior ou igual que 18 anos? ${condition}`)
return condition
})
/** output
*
* Enrique é maior ou igual que 18 anos? true
* Isa é maior ou igual que 18 anos? false <- Achou um menor que 18 e já para porque a condição voltou false
*/
Porém, se modificarmos a idade de Isa para 17 e a condição para buscarmos todos que tenham 16 anos ou mais, o every() vai ter que percorrer o array inteiro, retornando true.
const arr = [
{ nome: "Enrique", idade: 21 },
{ nome: "Isa", idade: 17 },
{ nome: "Eloah", idade: 16 },
];
nós temos como resultado
arr.every(pessoa => {
const condition = pessoa.idade >= 16
console.log(`${pessoa.nome} é maior ou igual que 16 anos? ${condition}`)
return condition
})
/** output
*
* Enrique é maior ou igual que 16 anos? true
* Isa é maior ou igual que 16 anos? true
* Eloah é maior ou igual que 16 anos? true <- todos passaram, então retorna true
*/
Se removermos o console no callback, iremos ver que o retorno será true
Array.sort()
O método sort() ordena os elementos do array e retorna o mesmo. Lembrando que o sort() sempre muda o array original.
const asc = [ 'f', 'j', 'a', 'e', 'z' ].sort((a, b) => a > b ? 1 : -1)
const desc = [ 'f', 'j', 'a', 'e', 'z' ].sort((a, b) => a > b ? -1 : 1)
console.log(asc) //output [ 'a', 'e', 'f', 'j', 'z' ]
console.log(desc) //output [ 'z', 'j', 'f', 'e', 'a' ]
---
const asc = [ 9, 10, 3, 7, 8 ].sort((a, b) => a - b)
const desc = [ 9, 10, 3, 7, 8 ].sort((a, b) => b - a)
console.log(asc) //output: [ 3, 7, 8, 9, 10 ]
console.log(desc) //output: [ 10, 9, 8, 7, 3 ]
Porém, se nenhuma função de comparação for passada ao sort(), o mesmo irá ordenar por string, usando o array de números como exemplo, ficaria assim
const arr = [ 9, 10, 3, 7, 8 ].sort()
console.log(arr) //output: [ 10, 3, 7, 8, 9 ]
Isso porque o sort() converte cada número pra string e compara caractere por caractere. O "10" começa com "1", que vem antes do "3", e por isso ele fica na frente, e assim por diante.
Array.join()
O método join() juntará todos os elementos de um array e retornará como string.
const arr = ['uni', 'duni', 'tê']
console.log(arr.join()) //output: 'uni,duni,tê'
console.log(arr.join('')) //output: 'unidunitê'
console.log(arr.join('-')) //output: 'uni-duni-tê'
mas caso o array tenha algum undefined ou null, esse elemento vira uma string vazia no resultado
const arr = ['uni', null, 'tê']
console.log(arr.join()) //output: 'uni,,tê'
console.log(arr.join('')) //output: 'unitê'
console.log(arr.join('-')) //output: 'uni--tê'
Array.includes()
O método includes() verifica se um array contém um determinado elemento, retornando true ou false
const arr = [2, 4, 6, 8, 10]
console.log(arr.includes(8)) //output: true
console.log(arr.includes(0)) //output: false
Array.concat()
O método concat() retorna um novo array com todos os array/valores passados como parâmetro
const arr1 = [1, 2, 3, 4, 5]
const arr2 = [6, 7, 8, 9, 10]
const newArr = arr1.concat(arr2)
console.log(newArr) //output: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
Fim!
E ai curtiu ? Então passa la no meu perfil, e da uma olhada nos demais artigos 😄
Top comments (0)