Ordenar matriz de objeto por propiedad en JavaScript

Para ordenar un array de objetos por una de sus propiedades, pasa un comparador a sort(). El comparador lee esa propiedad de dos objetos y devuelve un número negativo si el primero debe ir antes, uno positivo si debe ir después o cero si sus claves son iguales. Usa una comparación de cadenas para las claves de texto y una resta para las numéricas.

Ordenar un array de objetos por una propiedad de tipo cadena

Un comparador puede normalizar dos cadenas antes de compararlas. Así, el ejemplo no distingue entre mayúsculas y minúsculas, pero conserva en los objetos el valor original de cada lastName.

Ejecuta este ejemplo:

El código y las etiquetas o salidas visibles de esta sección se mantienen en inglés.

const students = [
  { firstName: 'Rohan', lastName: 'Dalal', age: 19 },
  { firstName: 'Zain', lastName: 'Ahmed', age: 17 },
  { firstName: 'Anadi', lastName: 'Malhotra', age: 19 }
];

students.sort((a, b) => {
  const left = a.lastName.toLowerCase();
  const right = b.lastName.toLowerCase();
  if (left < right) return -1;
  if (left > right) return 1;
  return 0;
});

console.log(students.map(student => student.lastName).join(', '));

Ahmed, Dalal, Malhotra

El comparador devuelve la señal de orden que necesita sort(); no tiene que devolver exactamente -1 o 1, sino cualquier valor negativo, cero o valor positivo. Convertir las cadenas a minúsculas resulta útil cuando las mayúsculas no deben afectar el orden. Esto no cambia los nombres almacenados, porque toLowerCase() devuelve una cadena nueva.

Ordenar cadenas con localeCompare()

Para las propiedades de tipo cadena, localeCompare() ofrece un comparador conciso y tiene en cuenta las reglas de ordenación propias del idioma. Devuelve un número negativo, cero o positivo, por lo que puede usarse directamente en sort():

El código y las etiquetas o salidas visibles de esta sección se mantienen en inglés.

const students = [
  { firstName: 'Rohan', lastName: 'Dalal', age: 19 },
  { firstName: 'Zain', lastName: 'Ahmed', age: 21 },
  { firstName: 'Anadi', lastName: 'Malhotra', age: 16 }
];

students.sort((a, b) => a.lastName.localeCompare(b.lastName));
console.log(students.map(student => student.lastName).join(', '));

Ahmed, Dalal, Malhotra

Elige este método cuando la clave sea texto y corresponda usar una comparación según la configuración regional. localeCompare() compara cadenas; no es un método para ordenar números. Si quieres especificar un idioma o usar opciones como la distinción entre mayúsculas y minúsculas, pasa a localeCompare() la configuración regional y las opciones que admita el entorno de ejecución.

Ordenar por una propiedad numérica

Resta la clave numérica del segundo objeto a la del primero. Si la primera edad es menor, a.age - b.age da un resultado negativo y coloca a antes que b en orden ascendente.

El código y las etiquetas o salidas visibles de esta sección se mantienen en inglés.

const students = [
  { firstName: 'Rohan', lastName: 'Dalal', age: 19 },
  { firstName: 'Zain', lastName: 'Ahmed', age: 21 },
  { firstName: 'Anadi', lastName: 'Malhotra', age: 16 }
];

students.sort((a, b) => a.age - b.age);
console.log(students.map(student => student.age).join(', '));

16, 19, 21

Este patrón de resta sirve para valores numéricos. No lo uses con nombres: restar cadenas no expresa su orden alfabético. Del mismo modo, si no pasas un comparador, sort() no inspecciona una propiedad del objeto; en su orden predeterminado compara las representaciones en forma de cadena de los elementos del array. Por eso, normalmente los objetos necesitan un comparador explícito.

Ordenar en orden descendente

Invierte los operandos del comparador para invertir el orden. Para ordenar edades numéricas, b.age - a.age coloca primero las edades mayores. Así, la regla de comparación sigue vinculada a la propiedad elegida y no hace falta ordenar en un sentido para luego invertir el array resultante.

El código y las etiquetas o salidas visibles de esta sección se mantienen en inglés.

const students = [
  { firstName: 'Rohan', lastName: 'Dalal', age: 19 },
  { firstName: 'Zain', lastName: 'Ahmed', age: 21 },
  { firstName: 'Anadi', lastName: 'Malhotra', age: 16 }
];

students.sort((a, b) => b.age - a.age);
console.log(students.map(student => student.age).join(', '));

21, 19, 16

Para ordenar cadenas en orden descendente, invierte el resultado del comparador de cadenas; por ejemplo, niega a.lastName.localeCompare(b.lastName). Mantén coherente el comparador para que las claves iguales sigan devolviendo cero.

Comportamiento y límites importantes de sort()

sort() modifica el array en el sitio y devuelve ese mismo array. Si necesitas conservar el orden original, copia primero el array con const sortedStudents = [...students] y ordena la copia. Los objetos no se clonan, así que al ordenar solo cambia su posición en el array, no sus propiedades.

Si no se proporciona un comparador, sort() convierte los valores en cadenas y las compara. Por eso, la ordenación predeterminada no sirve para ordenar números ni para seleccionar una propiedad de los objetos. Proporciona un comparador que corresponda al tipo de la clave. Estos ejemplos suponen que cada objeto tiene la propiedad de tipo cadena o numérica indicada. No establecen cómo tratar las claves ausentes ni los tipos mezclados; valida esos datos o decide cómo deben compararse antes de aplicar el comparador.

Para consultar la API subyacente de los arrays, consulta la referencia del método sort().