Trier un tableau d'objets par clé unique avec une valeur de date

1. Qu’est-ce qu’un tableau JavaScript ?
2. Qu’est-ce qu’un objet JavaScript ?
3. Qu’est-ce qu’un tableau d’objets
4. Qu’est-ce que le prototype array.sort en Javascript ?
5. Trier un tableau d’objets avec la valeur de date

Dans cet article, nous discuterons des moyens de trier un tableau d’objets par clé unique avec une valeur de date et comprendrons ce qui suit :

• Qu’est-ce qu’un tableau ?
• Qu’est-ce qu’un objet ?
• Qu’est-ce qu’un tableau d’Objets ?
• Qu’est-ce que le prototype array.sort en JavaScript ?
• Comment trier un tableau d’objets avec la valeur de date

Qu’est-ce qu’un tableau JavaScript ?

En JavaScript, un tableau stocke plusieurs types de données dans une seule variable. Contrairement à certains autres langages de programmation, un tableau JavaScript peut contenir différents types de données dans le même tableau.

Chaque élément d’un tableau est stocké dans la RAM l’un après l’autre.

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

Chaque élément d’un tableau est accessible en passant son index à la variable tableau,

Remarque : les tableaux JavaScript sont indexés à zéro.

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

Qu’est-ce qu’un objet JavaScript ?

Un objet JavaScript est une collection de paires clé-valeur.

Une key est une caractéristique ou une propriété d’un objet. Pendant ce temps, une valeur est celle de cette propriété correspondante.

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

Une valeur de la propriété des objets JavaScript peut être récupérée en combinant le nom de l’objet avec le nom de la propriété ; nous pouvons le voir dans le segment de code suivant.

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

Qu’est-ce qu’un tableau d’objets

Un tableau d’objets est un tableau dans lequel chaque élément du tableau JavaScript est un objet. Un tableau d’objets est similaire à tout autre tableau JavaScript, à la différence près que chaque élément est un objet JavaScript.

Vérifions l’exemple suivant pour une meilleure compréhension :

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’est-ce que le prototype array.sort en Javascript ?

Le Array.prototype.sort() sans aucun argument est utilisé pour trier un tableau par ordre croissant. Mais gardez à l’esprit que la fonction convertit les éléments du tableau en chaîne et les compare en fonction de leur séquence d’unités de code UTF-16, de sorte qu’il peut ne pas sembler trié à un utilisateur normal.

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

Alternativement, une fonction de comparaison peut être fournie en tant que fonction de rappel au array.sort, qui triera le tableau selon les critères suivants :

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

Trier un tableau d’objets avec la valeur de date

Vous pouvez trier un tableau d’objets par date en utilisant la même méthode de tri décrite ci-dessus.

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);

Cela comparera chaque date et retournera -1 si la première date est inférieure à la seconde. Si la première date est supérieure à la deuxième date, elle renverra 1 ; sinon, il renverra 0.

Le segment de code ci-dessus enregistre le tableau suivant.

[{
  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'
 }]