Ordenar un array de objetos por clave única con valor de fecha

1. Qué es un array de JavaScript
2. Qué es un objeto de JavaScript
3. Qué es un array de objetos
4. Qué es el prototipo array.sort en Javascript
5. Ordenar un array de objetos con el valor de fecha

En este artículo, discutiremos formas de ordenar un array de objetos por clave única con valor de fecha y comprenderemos lo siguiente:

• ¿Qué es un array?
• Qué es un Objeto
• Qué es un array de objetos
• Qué es el prototipo array.sort en JavaScript
• Cómo ordenar un array de objetos con el valor de la fecha

Qué es un array de JavaScript

En JavaScript, un array almacena múltiples tipos de datos en una sola variable. A diferencia de otros lenguajes de programación, un array de JavaScript puede contener diferentes tipos de datos en el mismo array.

Cada elemento de un array se almacena en la RAM uno tras otro.

const randomArray = ['Tahseen', 1, 0.3, true];
console.log(randomArray);
// logs: Tahseen , 1 , 0.3 , true

Se puede acceder a cada elemento de un array pasando su índice a la variable del array,

console.log(randomArray[0]);
// logs: Tahseen

Qué es un objeto de JavaScript

Un objeto de JavaScript es una colección de pares clave-valor.

Una clave es una característica o una propiedad de un objeto. Por su parte, un valor es el de esa propiedad correspondiente.

const Car = {
  company: 'Tesla',
  model: 'Model 3',
  year: 2017
};

Se puede recuperar un valor de propiedad de objetos de JavaScript combinando el nombre del objeto con el nombre de la propiedad; podemos verlo en el siguiente segmento de código.

console.log(Car.company);
// logs: Tesla

Qué es un array de objetos

un array de objetos es un array en la que cada elemento dentro del array de JavaScript es un objeto. un array de objetos es similar a cualquier otra matriz de JavaScript, con la diferencia de que cada elemento es un objeto de JavaScript.

Veamos el siguiente ejemplo para una mejor comprensión:

const MyAppointments = [
  {
    'with': 'Doctor Tauseef',
    'designation': 'Dentist',
    'reason': 'Toothache',
    'date': '2021-12-01T06:25:24Z',
  },
  {
    'with': 'Abdullah Abid',
    'designation': 'Software Engineer',
    'reason': 'An Idea for a App',
    'date': '2021-12-01T06:25:24Z',
  },
  {
    'with': 'Muhammad Haris',
    'designation': 'Painter',
    'reason': 'Need to pain the house',
    'date': '2021-13-01T06:25:24Z',
  },
]

Qué es el prototipo array.sort en Javascript

El Array.prototype.sort() sin ningún argumento se usa para ordenar un array en orden ascendente. Pero tenga en cuenta que la función convierte los elementos del array en cadenas y los compara en función de su secuencia de unidades de código UTF-16, por lo que es posible que un usuario normal no lo vea ordenado.

const Months = ['March', 'Jan', 'Feb', 'Dec'];
Months.sort();
console.log(Months);
// logs: ["Dec", "Feb", "Jan", "March"]

Alternativamente, se puede proporcionar una función de comparación como función de devolución de llamada a array.sort, que ordenará la matriz según los siguientes criterios:

const Numbers = [4, 2, 5, 1, 3];
Numbers.sort((x, y) => x - y);
console.log(Numbers);
// logs: [1, 2, 3, 4, 5]

Ordenar un array de objetos con el valor de fecha

Puede ordenar un array de objetos por fecha utilizando el mismo método de ordenación descrito anteriormente.

let MyAppointments = [
  {
    'with': 'Doctor Tauseef',
    'designation': 'Dentist',
    'reason': 'Toothache',
    'appointment_date': '2021-12-01T06:25:24Z',
  },
  {
    'with': 'Abdullah Abid',
    'designation': 'Software Engineer',
    'reason': 'An Idea for a App',
    'appointment_date': '2021-12-09T06:25:24Z',
  },
  {
    'with': 'Muhammad Haris',
    'designation': 'Painter',
    'reason': 'Need to pain the house',
    'appointment_date': '2021-12-05T06:25:24Z',
  },
]

MyAppointments.sort(function(x, y) {
  var firstDate = new Date(x.appointment_date),
      SecondDate = new Date(y.appointment_date);

  if (firstDate < SecondDate) return -1;
  if (firstDate > SecondDate) return 1;
  return 0;
});

console.log(MyAppointments);

Esto comparará cada fecha y devolverá -1 si la primera fecha es menor que la segunda. Si la primera fecha es mayor que la segunda fecha, devolverá 1; de lo contrario, devolverá 0.

El segmento de código anterior registra la siguiente matriz.

[{
  with: 'Doctor Tauseef',
  designation: 'Dentist',
  reason: 'Toothache',
  appointment_date: '2021-12-01T06:25:24Z'
},
 {
   with: 'Muhammad Haris',
   designation: 'Painter',
   reason: 'Need to pain the house',
   appointment_date: '2021-12-05T06:25:24Z'
 },
 {
   with: 'Abdullah Abid',
   designation: 'Software Engineer',
   reason: 'An Idea for a App',
   appointment_date: '2021-12-09T06:25:24Z'
 }]