Arrays, Objekte und Arrays von Objekten alphabetisieren

Avatar of Chris Coyier
Chris Coyier am

Ein Array

let fruits = [`bananas`, `Apples`, `Oranges`];

Sie können das irgendwie so einfach alphabetisieren wie

fruits.sort();

Aber beachten Sie die inkonsistente Groß-/Kleinschreibung im Array... Großbuchstaben werden alle vor Kleinbuchstaben sortiert (seltsamerweise), daher wird es etwas komplizierter.

let fruits = [`bananas`, `Apples`, `Oranges`];
fruits.sort((a, b) => {
  return a.toLowerCase().localeCompare(b.toLowerCase());
})
console.log(fruits);

// ["Apples", "bananas", "Oranges"]

Array von Objekten

Die Dinge werden noch kniffliger, wenn das, was Sie sortieren möchten, in Objekten verschachtelt ist. Könnte leicht der Fall sein, wenn man mit einer JSON-API arbeitet.

let fruits = [
  {
    fruit: `Bananas`
  },
  {
    fruit: `apples`
  },
  {
    fruit: `Oranges`
  }
];

Wir könnten eine benutzerdefinierte Sortierfunktion dafür erstellen, aber ein kleiner Schritt weiter ist, eine allgemeinere Funktion zu erstellen, die den Schlüssel, nach dem sortiert werden soll, als Parameter übernimmt.

const propComparator = (propName) =>
  (a, b) => a[propName].toLowerCase() == b[propName].toLowerCase() ? 0 : a[propName].toLowerCase() < b[propName].toLowerCase() ? -1 : 1

So können wir sie jetzt zum Sortieren verwenden

fruits.sort(propComparator(`fruit`));
console.log(fruits);

/*
[
  {fruit: "apples"},
  {fruit: "Bananas"},
  {fruit: "Oranges"}
]
*/

Nur ein Objekt

Wenn wir nur ein Objekt haben...

let fruits = {
  Bananas: true,
  apples: false,
  Oranges: true
};

Wir müssen diese Schlüssel immer noch in Kleinbuchstaben umwandeln, aber wir können ein Array der Schlüssel sortieren und dann aus diesem neu sortierten Array von Schlüsseln ein neues Objekt erstellen.

let sortedFruits = {};
Object.keys(fruits).sort((a, b) => {
  return a.toLowerCase().localeCompare(b.toLowerCase());
}).forEach(function(key) {
  sortedFruits[key] = fruits[key];
});
console.log(sortedFruits);

/*
{
  apples: false, 
  Bananas: true, 
  Oranges: true
}
*/

Array von Objekten, das nach Schlüssel sortiert werden soll

let fruits = [
  {
    Bananas: true
  },
  {
    Apples: false
  },
  {
    oranges: true
  }
];

Dies ist wahrscheinlich das kniffligste von allen, aber es sollten genügend Informationen vorhanden sein, um es zu lösen. Verstehen Sie es.

Live-Code

Sehen Sie den Pen Alphabetizing Arrays von Chris Coyier (@chriscoyier) auf CodePen.