Grupo uma variedade de objetos em JavaScript

Às vezes, os desenvolvedores precisam organizar uma variedade de objetos de acordo com uma chave específica ou valor da propriedade. O JavaScript oferece alguns métodos e bibliotecas predefinidos para fazer isso, incluindo o “reduzir()”Método ou o“grupo ()”Método da biblioteca de Lodash.

Este tutorial demonstrará métodos para agrupar objetos JavaScript em uma matriz.

Como agrupar uma variedade de objetos em JavaScript?

Para agrupar uma variedade de objetos em JavaScript, use os seguintes métodos:

• Método Reduce ()
• Método Groupby () da Biblioteca Lodash

Vamos entender o funcionamento desses métodos um por um.

Método 1: Grupo uma variedade de objetos usando o método Reduce ()

O método mais usado para agrupar a variedade de objetos é o “reduzir()”Método. É invocado com a função de devolução. Reduz a variedade de objetos agrupados pelo tipo especificado. O método reduz () é poderoso, mas um pouco complexo para entender.

Sintaxe

Use a seguinte sintaxe para o método Reduce () para agrupar uma variedade de objetos:

Reduce (AnteriorValue, CurrentValue)

Valor de retorno

Ele retorna a soma de todos os elementos agrupados em uma matriz.

Exemplo

Crie uma variedade de objetos “variedade”Com propriedades, nomes e categorias:

const array = [
Nome: "Apple", categoria: "Fruits",
Nome: "Orange", Categoria: "Colors",
nome: "manga", categoria: "frutas",
Nome: "Peach", Categoria: "Colors",
Nome: "Orange", Categoria: "Fruits",
nome: "uvas", categoria: "frutas",
];

Ligar para "reduzir()”Método com a função de seta de chamada de chamada que agrupará os objetos com base na chave“ categoria ”e os armazenará em uma variável“groupArrayObject”:

const GroupArrayObject = Array.Reduce ((grupo, arr) =>
const category = arr;
Grupo [Categoria] = Grupo [Categoria] ?? [];
Grupo [categoria].push (arr);
grupo de retorno;
,
);

Imprima a matriz resultante no console usando o “console.registro()”Método:

console.log (groupArrayObject);

Saída

Na saída acima, a matriz resultante possui duas matrizes minimizadas “Cores" e "Frutas”. Basta clicar na cabeça da matriz ao lado do nome da matriz minimizada para expandi -lo:

Agora a saída mostra dois objetos, “Cores" e "Frutas,“Que contêm 2 e 4 matrizes, respectivamente.

Método 2: Grupo uma variedade de objetos usando o método groupby ()

Outro método para agrupar uma variedade de objetos é o “grupo ()”Método. O método Groupby () será usado no projeto NPM com o “Lodash" biblioteca. É mais simples de entender e leva menos linhas de código.

Sintaxe

Siga a sintaxe mencionada abaixo para o método Groupby () para agrupar a matriz de objetos em JavaScript:

_.grupo (lista, chave)

Na sintaxe acima,

• O "lista”É uma variedade de objetos.
• O "chave”É propriedade dos objetos pelos quais os elementos serão agrupados.

Valor de retorno

Ele retorna as várias coleções agrupadas por uma determinada chave.

Exemplo

Use os seguintes comandos para incluir a biblioteca Lodash em seu projeto NPM:

$ npm i -g npm
$ npm I -Save lodash

Em seguida, adicione a biblioteca de Lodash no arquivo JavaScript com a seguinte linha:

var _ = requer ("lodash");

Depois disso, basta usar as seguintes linhas de código:

const array = [
Nome: "Apple", categoria: "Fruits",
Nome: "Orange", Categoria: "Colors",
nome: "manga", categoria: "frutas",
Nome: "Peach", Categoria: "Colors",
Nome: "Orange", Categoria: "Fruits",
nome: "uvas", categoria: "frutas",
];
Deixe a saída = _.grupo (Array, "Categoria");
console.log (saída);

Neste snippet de código:

• Crie uma variedade de objetos chamados "Array".
• Ligar para "grupo ()”Método passando uma variedade de objetos“variedade"E uma chave"categoria”Nele, que agrupa todos os elementos relacionados às categorias.

Execute o código acima e a saída será:

Pode -se observar facilmente que os objetos agora foram agrupados com base no valor da chave de "categoria".

Conclusão

Para agrupamento, uma variedade de objetos em JavaScript, use o “reduzir()”Método ou o“grupo ()”Método. O método reduz () é o método mais usado para agrupar uma variedade de objetos, enquanto o método Groupby () requer menos código e é mais fácil de entender, mas será executado no projeto NPM com a biblioteca Lodash. Este tutorial demonstrou os métodos para agrupar objetos JavaScript em uma matriz.