Come ottenere valori distinti da una matrice di oggetti in JavaScript?

Come ottenere valori distinti da una matrice di oggetti in JavaScript?
Gli array sono spesso utilizzati per archiviare i dati in JavaScript. Questi array possono contenere oggetti con molte proprietà. Mentre lavorano con questi tipi di array, gli sviluppatori affrontano spesso una situazione in cui devono estrarre valori unici o diversi da array. Ad esempio, recuperare un elenco di tutte le categorie di prodotti distinti/unici e così via.

Questo blog definirà i modi per ottenere valori distinti/univoci da una serie di oggetti in JavaScript.

Come ottenere valori distinti/univoci da una matrice di oggetti in JavaScript?

Per ottenere i valori univoci da un array di oggetti, utilizzare i seguenti approcci:

  • Oggetto "Imposta" con il metodo "Map ()".
  • Metodo "Filter ()" con metodo "Map ()".

Metodo 1: ottenere valori distinti da un array di oggetti usando l'oggetto "set" con metodo "map ()"

Per recuperare valori distinti da una matrice di oggetti, usa il "Impostato"Oggetto con il"carta geografica()" metodo. Il "set" consente di salvare valori distinti di qualsiasi tipo. Il metodo "Map ()" viene utilizzato per la creazione di un nuovo array che contiene l'output invocando una determinata funzione di callback su ciascun elemento dell'array originale. Accetta una funzione come parametro che la chiama su ogni elemento array e quindi emette un nuovo valore.

Esempio

Crea una matrice di oggetti chiamati "StudentDetails":

const StudentDetails = [
id: 1, nome: "Joseph", età: 15,
id: 2, nome: "milli", età: 13,
id: 3, nome: "John", età: 11,
id: 4, nome: "Mike", età: 16,
id: 5, nome: "John", età: 18
];

Chiama il metodo Map () per creare un nuovo array con solo "nome"Proprietà di ciascun oggetto nell'array originale. Passalo al costruttore set che memorizzerà i valori univoci rimuovendo tutti i valori duplicati. Quindi, utilizza l'operatore di diffusione ".. "Per convertire l'oggetto set in un array:

const distinctstdnames = [… nuovo set (StudentDetails.mappa (obj => obj.nome))];

Infine, stampa l'array risultante sulla console:

console.log (distinctstdnames);

L'output indica che l'array di valori di nome distinti è stato recuperato correttamente da un array di oggetti:

Metodo 2: ottenere valori distinti da un array di oggetti usando il metodo "Filter ()" Con il metodo "map ()"

Un altro approccio per ottenere i valori unici da una serie di oggetti è usare il "filtro()Metodo "con il"carta geografica()" metodo. Il metodo "Filter ()" crea un nuovo array con tutti gli elementi che passano una condizione specifica, mentre il metodo "Map ()" crea un nuovo array con i risultati di invocare una funzione fornita su ciascun membro nell'array.

Esempio

Invoca il metodo "filtro ()" con il metodo "map ()" per recuperare i valori univoci di "nome"Proprietà degli oggetti:

const distinctstdnames = StudentDetails.mappa ((elemento) => elemento.nome)
.filtro ((nome, indice, currentVal) =>
CurrentVal.INDICEF (nome) === INDICE
);

Infine, visualizza i valori univoci sulla console:

console.log (distinctstdnames);

Produzione

Si tratta di ottenere valori distinti/univoci da una serie di oggetti in JavaScript.

Conclusione

Per ottenere i valori univoci da un array di oggetti, usa il "Impostato"Oggetto con il"carta geografica()Metodo o il "filtro()Metodo "con il"carta geografica()" metodo. In termini di prestazioni, il primo approccio "imposta" con il metodo "map ()" è il migliore. Questo blog ha definito i modi per ottenere valori unici da una matrice di oggetti in JavaScript.