Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Save felisio/4eb4d427951b26e3d1616a411e93df87 to your computer and use it in GitHub Desktop.
Save felisio/4eb4d427951b26e3d1616a411e93df87 to your computer and use it in GitHub Desktop.
Métodos de iteração de Array

Métodos de iteração de Array

Adaptação do fork: (https://gist.github.com/ljharb/58faf1cfcb4e6808f74aae4ef7944cff)

Ao tentar explicar como o Javascript usa seu métodos para arrays, acabei reunindo esses conceitos. Espero que Seja util. Ficarei feliz com qualquer sugestão.

Introdução

O Objet Array no Javascript tem muitos métodos construidos no seu prototype. Alguns deles modificam o proprio array passado. Felizmente, a maioria não, eles retonar um novo array inteiramente distinto. Uma vez que arrays são conceitualmente uma lista de itens, ajuda na clareza do código e sua manutenção a ponto de ser capas de operar de uma forma mais "funcional" . (Eu insisto em refrenciar um array como uma "Lista" - embora em algumas linguaguens de programação, Lista é um tipo de dado nativo, mais em JS e nesse POST, estou me referindo ao conceito. Em todos os lugares que eu usar a palavra "lista" você pode assumir que eu estou falando de JS Array) Isso siginifica, para a execução de uma simples operação na Lista como um todo ("automagicamente"), ira retornar uma nova lista - Dessa forma fica muito mais simples de pensar tanto na antiga lista como na nova, o que elas contem, e o que aconteceu durante a operação.

Abaixo estão alguns desses métodos de iterate (iteração) - em outras palavras, que operam em toda a lista, um item de cada vez. quando eles são invocados, fornecem um callback function (função de retorno) - uma unica função que opera em um item de cada vez. Com base no método de Array que você escolhe, os callback obtém argumentos especificos, e pode ser esperado para retorno um certo tipo de valor - e (exceto para o forEach) o valor retornado determina o valor final que sera retornado que abrange a operação de array. Embora a maioria dos métodos garantem a execução para cada item no array - para todos eles - alguns desses métodos podem parar a operação parcialmente; quando aplicável, isto é indicado abaixo.

Todos os métodos de array iteram no que é tradicionalmente chamado de "left to right"(esquerda pra direita) - mais precisamente (e menos etnocentricamente) a partir do index 0, para index length - 1 - também chamado "start" to "end"(Inicio para o Fim). reduceRight é uma execeção, porque ele intera no sentido reverso - partir do end to start(Fim para o Inicio).


forEach:

  • comportamento do callback: aqui esta um item. aqui você pode fazer qualquer coisa com ele, não importa o quê.
  • argumentos recebidos: item, index, list
  • valor retornado: nada - em outras palavras, undefined
  • exemplo de uso:
[1, 2, 3].forEach(function (item, index) {
  console.log(item, index);
});

map:

  • comportamento do callback: aqui esta um item. o que devo colocar na nova lista em seu lugar?
  • argumentos recebidos: item, index, list
  • valor retornado: lista de novos itens
  • exemplo de uso:
const three = [1, 2, 3];
const doubled = three.map(function (item) {
  return item * 2;
});
console.log(three === doubled, doubled); // false, [2, 4, 6]

filter:

  • callback imperativo - O seu retorno sempre representa um valor verdadeiro ou falso
  • comportamento do callback: Devo manter esse item?
  • argumentos recebidos: item, index, list
  • valor retornado: lista de itens mantidos
  • exemplo de uso:
const ints = [1, 2, 3];
const evens = ints.filter(function (item) {
  return item % 2 === 0;
});
console.log(ints === evens, evens); // false, [2]

reduce:

  • comportamento do callback: Aqui esta o resultado da interação anterior. O que devo passar para a proxima interação?
  • argumentos recebidos: result, item, index, list
  • valor retornado: resultado da ultima iteração
  • exemplo de uso:
// NOTA: `reduce` e `reduceRight` tem como argumento opcional o "initialValue" (Valor inicial), passado depois da função de callback do reducer.
// se omitido, ele ira usar o primeiro item como valor inicial.
const sum = [1, 2, 3].reduce(function (result, item) {
  return result + item;
}, 0); // se o `0` for omitido, `1` será o primeiro `result`, and `2` será o primeiro `item`

reduceRight: (igual ao reduce, porem em ordem inversa: fim-para-inicio)

some:

  • callback imperativo - O seu retorno sempre representa um valor verdadeiro ou falso
  • comportamento do callback: Este item atende ao seu criterio?
  • argumentos recebidos: item, index, list
  • valor retornado: true após o primeiro item atender ao seu criterio, senão false
  • nota: Para a iteração, uma véz que o valor do seu callback for verdadeiro.
  • exemplo de uso:
const hasNegativeNumbers = [1, 2, 3, -1, 4].some(function (item) {
  return item < 0;
});
console.log(hasNegativeNumbers); // true

every:

  • callback imperativo - O seu retorno sempre representa um valor verdadeiro ou falso
  • comportamento do callback: Este item atende ao seu criterio?
  • argumentos recebidos: item, index, list
  • valor retornado: false após o primeiro item NÃO atender ao seu criterio, senão true
  • nota: Para a iteração, uma véz que o valor do seu callback for Falso.
  • exemplo de uso:
const allPositiveNumbers = [1, 2, 3].every(function (item) {
  return item > 0;
});
console.log(allPositiveNumbers); // true

find:

  • callback imperativo - O seu retorno sempre representa um valor verdadeiro ou falso
  • comportamento do callback: Este é o item que voê esta procurando?
  • argumentos recebidos: item, index, list
  • valor retornado: O item que você esta procurando, ou undefined
  • nota: Para a iteração, uma véz que o valor do seu callback for verdadeiro.
  • exemplo de uso:
const objects = [{ id: 'a' }, { id: 'b' }, { id: 'c' }];
const found = objects.find(function (item) {
  return item.id === 'b';
});
console.log(found === objects[1]); // true

findIndex:

  • callback imperativo - O seu retorno sempre representa um valor verdadeiro ou falso
  • comportamento do callback: Este é o item que voê esta procurando?
  • argumentos recebidos: item, index, list
  • valor retornado: O index(posição do item na lista) do item que você esta procurando, ou -1
  • nota: Para a iteração, uma véz que o valor do seu callback for verdadeiro.
  • exemplo de uso:
const objects = [{ id: 'a' }, { id: 'b' }, { id: 'c' }];
const foundIndex = objects.findIndex(function (item) {
  return item.id === 'b';
});
console.log(foundIndex === 1); // true
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment