Ordenar matrices de objetos por orden personalizado

Beginner

This tutorial is from open-source community. Access the source code

Introducción

En este laboratorio, exploraremos cómo ordenar una matriz de objetos basados en una propiedad dada y una matriz de orden personalizada. Utilizaremos una combinación de Array.prototype.reduce() y Array.prototype.sort() para crear una nueva matriz que esté ordenada según el orden proporcionado en la matriz order. Este laboratorio es una gran oportunidad para aprender a manipular matrices de objetos en JavaScript.

Cómo ordenar una matriz de objetos según el orden de una propiedad

Para ordenar una matriz de objetos según el orden de una propiedad, siga estos pasos:

  1. Abra la Terminal/SSH y escriba node para comenzar a practicar la codificación.
  2. Utilice Array.prototype.reduce() para crear un objeto a partir de la matriz order con los valores como claves y su índice original como valor.
  3. Utilice Array.prototype.sort() para ordenar la matriz dada, saltando los elementos para los cuales prop está vacío o no está en la matriz order.

A continuación, se muestra un fragmento de código de ejemplo para ordenar una matriz de objetos según el orden de una propiedad:

const orderWith = (arr, prop, order) => {
  const orderValues = order.reduce((acc, v, i) => {
    acc[v] = i;
    return acc;
  }, {});
  return [...arr].sort((a, b) => {
    if (orderValues[a[prop]] === undefined) return 1;
    if (orderValues[b[prop]] === undefined) return -1;
    return orderValues[a[prop]] - orderValues[b[prop]];
  });
};

Puede utilizar la función orderWith para ordenar una matriz de objetos según el orden de una propiedad. Por ejemplo:

const users = [
  { name: "fred", language: "Javascript" },
  { name: "barney", language: "TypeScript" },
  { name: "frannie", language: "Javascript" },
  { name: "anna", language: "Java" },
  { name: "jimmy" },
  { name: "nicky", language: "Python" }
];
orderWith(users, "language", ["Javascript", "TypeScript", "Java"]);
/*
[
  { name: 'fred', language: 'Javascript' },
  { name: 'frannie', language: 'Javascript' },
  { name: 'barney', language: 'TypeScript' },
  { name: 'anna', language: 'Java' },
  { name: 'jimmy' },
  { name: 'nicky', language: 'Python' }
]
*/

Resumen

¡Felicidades! Has completado el laboratorio de Ordenar Matriz de Objetos Basado en el Orden de una Propiedad. Puedes practicar más laboratorios en LabEx para mejorar tus habilidades.