DEV Community

Josafá Marengo
Josafá Marengo

Posted on • Originally published at josafa.com.br

2

18 Métodos de Arrays em JavaScript que Você Deveria Saber

Os arrays são uma parte essencial da programação em JavaScript, proporcionando uma maneira poderosa de armazenar e manipular coleções de dados. Neste artigo, vamos explorar dezoito métodos fundamentais de arrays que todo programador JavaScript deveria conhecer para escrever código mais eficiente e claro.

1. Push

O método arr.push(..element) adiciona um novo elemento ao final de um array e retorna o novo comprimento do array. Este método altera o array original.

Sintaxe:

arr.push(element1, element2, )
Enter fullscreen mode Exit fullscreen mode

Exemplo:

let arr = [1, 2, 3];
arr.push(4); // arr agora é [1, 2, 3, 4]
Enter fullscreen mode Exit fullscreen mode

2. Pop

O método arr.pop() remove o último elemento de um array e retorna o elemento removido. Este método também altera o array original e seu comprimento.

Sintaxe:

arr.pop()
Enter fullscreen mode Exit fullscreen mode

Exemplo:

let arr = [1, 2, 3, 4];
arr.pop(); // arr agora é [1, 2, 3]
Enter fullscreen mode Exit fullscreen mode

3. Shift

O método arr.shift() remove o primeiro elemento de um array e retorna o elemento removido. Este método também altera o comprimento do array original.

Sintaxe:

arr.shift()
Enter fullscreen mode Exit fullscreen mode

Exemplo:

let arr = [1, 2, 3, 4];
arr.shift(); // arr agora é [2, 3, 4]
Enter fullscreen mode Exit fullscreen mode

4. Unshift

O método arr.unshift(elements) adiciona um ou mais elementos ao início de um array e retorna o novo comprimento do array.

Sintaxe:

arr.unshift(item1, item2, )
Enter fullscreen mode Exit fullscreen mode

Exemplo:

let arr = [2, 3, 4];
arr.unshift(1); // arr agora é [1, 2, 3, 4]
Enter fullscreen mode Exit fullscreen mode

5. Splice

O método arr.splice() modifica o array original removendo, substituindo ou adicionando elementos.

Sintaxe:

array.splice(start[, deleteCount[, item1[, item2[, ...]]]])
Enter fullscreen mode Exit fullscreen mode

Exemplo:

let arr = [1, 2, 3, 4];
arr.splice(1, 1); // arr agora é [1, 3, 4]
Enter fullscreen mode Exit fullscreen mode

6. Slice

O método arr.slice() seleciona uma parte de um array e retorna um novo array com os itens copiados do índice de início até o fim. O array original não é alterado.

Sintaxe:

arr.slice(start, end)
Enter fullscreen mode Exit fullscreen mode

Exemplo:

let arr = [1, 2, 3, 4];
let newArr = arr.slice(1, 3); // newArr é [2, 3]
Enter fullscreen mode Exit fullscreen mode

7. Includes

O método arr.includes(item, index) verifica se o item está presente no array a partir do índice fornecido e retorna true se encontrado, caso contrário, retorna false.

Sintaxe:

arr.includes(item, index)
Enter fullscreen mode Exit fullscreen mode

Exemplo:

let arr = [1, 2, 3, 4];
arr.includes(3); // true
Enter fullscreen mode Exit fullscreen mode

8. forEach

O método arr.forEach() executa uma função fornecida uma vez para cada elemento do array.

Sintaxe:

arr.forEach(callback)
Enter fullscreen mode Exit fullscreen mode

Exemplo:

let arr = [1, 2, 3, 4];
arr.forEach(num => console.log(num)); // imprime 1, 2, 3, 4
Enter fullscreen mode Exit fullscreen mode

9. Join

O método arr.join(separator) cria uma string com todos os elementos de um array concatenados, separados por um delimitador específico.

Sintaxe:

arr.join(separator)
Enter fullscreen mode Exit fullscreen mode

Exemplo:

let arr = [1, 2, 3, 4];
arr.join('-'); // "1-2-3-4"
Enter fullscreen mode Exit fullscreen mode

10. toString

O método arr.toString() converte um array em uma string e retorna o resultado.

Sintaxe:

arr.toString()
Enter fullscreen mode Exit fullscreen mode

Exemplo:

let arr = [1, 2, 3, 4];
arr.toString(); // "1,2,3,4"
Enter fullscreen mode Exit fullscreen mode

11. Map

O método map() chama uma função callback em cada elemento do array original e retorna um novo array com os resultados. Este é um método não mutante.

Sintaxe:

  arr.map(function callback(currentValue, index, array) {
    // Retorna um novo valor
  })
Enter fullscreen mode Exit fullscreen mode

Exemplo:

let arr = [1, 2, 3, 4];
let doubled = arr.map(num => num * 2); // [2, 4, 6, 8]
Enter fullscreen mode Exit fullscreen mode

12. Reduce

O método reduce() aplica uma função a um acumulador e cada elemento do array (da esquerda para a direita) para reduzir a um único valor.

Sintaxe:

arr.reduce(function callback(accumulator, currentValue, index, array) {
  // Retorna o valor acumulado
}, initialValue)
Enter fullscreen mode Exit fullscreen mode

Exemplo:

let arr = [1, 2, 3, 4];
let sum = arr.reduce((acc, num) => acc + num, 0); // 10
Enter fullscreen mode Exit fullscreen mode

13. Filter

O método filter() cria um novo array com todos os elementos que passaram no teste implementado pela função fornecida.

Sintaxe:

arr.filter(function callback(element, index, array) {
  // Retorna true para manter o elemento
})
Enter fullscreen mode Exit fullscreen mode

Exemplo:

let arr = [1, 2, 3, 4];
let even = arr.filter(num => num % 2 === 0); // [2, 4]
Enter fullscreen mode Exit fullscreen mode

14. Sort

O método sort() organiza os elementos de um array em ordem crescente ou conforme a função de comparação fornecida.

Sintaxe:

arr.sort([compareFunction])
Enter fullscreen mode Exit fullscreen mode

Exemplo:

let arr = [4, 2, 3, 1];
arr.sort(); // [1, 2, 3, 4]
Enter fullscreen mode Exit fullscreen mode

15. Find

O método find() retorna o primeiro elemento no array que satisfaz a função de teste fornecida.

Sintaxe:

arr.find(function callback(element, index, array) {
  // Retorna true para encontrar o elemento
})
Enter fullscreen mode Exit fullscreen mode

Exemplo:

let arr = [1, 2, 3, 4];
let found = arr.find(num => num > 2); // 3
Enter fullscreen mode Exit fullscreen mode

16. IndexOf

O método indexOf() retorna o primeiro índice no qual um dado elemento pode ser encontrado no array, ou -1 se o elemento não estiver presente.

Sintaxe:

arr.indexOf(searchElement, fromIndex)
Enter fullscreen mode Exit fullscreen mode

Exemplo:

let arr = [1, 2, 3, 4];
let index = arr.indexOf(3); // 2
Enter fullscreen mode Exit fullscreen mode

17. Some

O método some() testa se ao menos um elemento no array passa na função de teste implementada.

Sintaxe:

arr.some(function callback(element, index, array) {
  // Retorna true se pelo menos um elemento passar no teste
})
Enter fullscreen mode Exit fullscreen mode

Exemplo:

let arr = [1, 2, 3, 4];
let hasEven = arr.some(num => num % 2 === 0); // true
Enter fullscreen mode Exit fullscreen mode

18. Concat

O método concat() é usado para mesclar dois ou mais arrays.

Sintaxe:

arr.concat(array2, array3, ..., arrayN)
Enter fullscreen mode Exit fullscreen mode

Exemplo:

let arr1 = [1, 2];
let arr2 = [3, 4];
let merged = arr1.concat(arr2); // [1, 2, 3, 4]
Enter fullscreen mode Exit fullscreen mode

Esses métodos são fundamentais para trabalhar com arrays em JavaScript. Dominar esses métodos permitirá que você manipule dados de forma mais eficiente e escreva códigos mais limpos e legíveis. Feliz codificação!

Referências:

Sentry image

See why 4M developers consider Sentry, “not bad.”

Fixing code doesn’t have to be the worst part of your day. Learn how Sentry can help.

Learn more

Top comments (0)

SurveyJS custom survey software

JavaScript UI Libraries for Surveys and Forms

SurveyJS lets you build a JSON-based form management system that integrates with any backend, giving you full control over your data and no user limits. Includes support for custom question types, skip logic, integrated CCS editor, PDF export, real-time analytics & more.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay