Programação funcional - sabrinabm94/frontend GitHub Wiki

Utilizado para manipular dados de um array, retornando um novo array com os resultados, não modificando o conteúdo do array original.

Filter (buscar)

Busca num array pela informação desejada retornando os valores encontrados, ou seja, usado para filtrar valores de um array e salvar os selecionados dentro de um novo array.

const prices = [
"R$ 100", "R$ 200", "accounts", "R$ 500", "data"];

const pricesFiltered = prices.filter(price => price.includes("R$"));

console.log(pricesFiltered);
//"R$ 100", "R$ 200", "R$ 500"

var months = [
    {shortName: 'JAN', fullName: 'January',  number: 1},
    {shortName: 'FEB', fullName: 'February', number: 2},
    ...
];

var firstSemester = months.filter(function(month) {
    return month.number <= 6;
});

console.log(firstSemester); // ['JAN', 'FEB', .. , 'JUN']

Map (manipular)

É usado para manipular o conteúdo de um array, ou seja, usado para percorrer todos os valores de um array e retornar o resultado dentro de um novo array.

const prices = [
"R$ 100", "R$ 200", "accounts", "R$ 500", "data"];

const pricesFiltered = prices.filter(price => price.includes("R$"));

const pricesMapped = pricesFiltered .map(function(price) {
return price.replace('R$ ', '') + ',00';
}
);

console.log(pricesMapped );
//"100.00", "200.00", "500.00"

var months = [
    {shortName: 'JAN', fullName: 'January',  number: 1},
    {shortName: 'FEB', fullName: 'February', number: 2},
    ...
];

var shortNameMonths = months.map(function(month) {
    return month.shortName;
});

console.log(shortNameMonths); // ['JAN', 'FEB', ...]

//map dentro de map
let subcategories = [
  {
    id: 5050,
    name: "Acessibilidade",
    slug: "reformas-e-reparos/acessibilidade",
    children: [
      {
        id: 5054,
        name: "Consultoria",
        slug: "reformas-e-reparos/acessibilidade/consultoria",
      },
      {
        id: 5055,
        name: "Instalação de Acessórios e Equipamentos",
        slug: "reformas-e-reparos/acessibilidade/instalacao-de-acessorios-e-equipamentos",
      },
      {
        id: 5056,
        name: "Laudos Técnicos",
        slug: "reformas-e-reparos/acessibilidade/laudos-tecnicos",
      },
      {
        id: 5057,
        name: "Projeto de Acessibilidade",
        slug: "reformas-e-reparos/acessibilidade/projeto-de-acessibilidade",
      },
      {
        id: 5058,
        name: "Sinalização",
        slug: "reformas-e-reparos/acessibilidade/sinalizacao",
      },
    ],
  },
  {
    id: 5071,
    name: "Afiação",
    slug: "reformas-e-reparos/afiacao",
    children: [
      {
        id: 5072,
        name: "Alicates e Tesouras",
        slug: "reformas-e-reparos/afiacao/alicates-e-tesouras",
      },
      {
        id: 5073,
        name: "Bisturis e Estiletes",
        slug: "reformas-e-reparos/afiacao/bisturis-e-estiletes",
      },
      {
        id: 5074,
        name: "Cutelos e Facas",
        slug: "reformas-e-reparos/afiacao/cutelos-e-facas",
      },
      {
        id: 5075,
        name: "Espadas",
        slug: "reformas-e-reparos/afiacao/espadas",
      },
      {
        id: 5076,
        name: "Outros",
        slug: "reformas-e-reparos/afiacao/outros",
      },
    ],
  },
];

let categoryWithSubcategoriesChildrenNames = subcategories.map(
  (subcategory) => {
    return [
      subcategory.name,
      subcategory.children.map((children) => {
        return children.name;
      }),
    ];
  }
);

console.log(categoryWithSubcategoriesChildrenNames);

Reduce (valor único)

É usado para retornar um valor único resultante de uma manipulação de array, ou seja, usado para reduzir os valores de um array retornando em um único valor.

var months = [
    {shortName: 'JAN', fullName: 'January',  number: 1},
    {shortName: 'FEB', fullName: 'February', number: 2},
    ...
];

var monthsAcc = months.reduce(function(acc, month) {
    return acc + '/' + month.shortName;
}, '');

console.log(monthsAcc); // /JAN/FEB/MAR/APR...