JavaScript-Programmierung von Kopf bis Fuß

460 Kapitel 10

Ein Array mit Zahlen sortieren

var numbersArray = [60, 50, 62, 58, 54, 54];

numbersArray.sort(compareNumbers);

console.log(numbersArray);

JavaScript-Konsole

[50, 54, 54, 58, 60, 62]

Nachdem wir eine Vergleichsfunktion geschrieben haben, müssen wir nur noch die sort-

Methode am numbersArray aufrufen und ihr die Funktion übergeben. Das geht so:

Die Einzelteile zusammensetzen

Wir rufen die sort-

Methode am Array auf und

übergeben ihr die Funktion

compareNumbers.

Hat sort seine Arbeit beendet, ist das Array in

aufsteigender Reihenfolge sortiert, und wir können

es zur Überprüfung auf der Konsole ausgeben.

Hier ist das Array,

in aufsteigender

Reihenfolge sortiert.

Die sort-Methode hat numbersArray in aufsteigender Reihenfolge sortiert, denn durch die

Rückgabe der Werte 1, 0 und -1 geben wir der sort-Methode diese Anweisungen:

1: Platziere das erste Element hinter dem zweiten.

0: Die Elemente sind gleich, die Reihenfolge ändert sich nicht.

-1: Platziere das zweite Element vor dem ersten.

Um die Elemente in absteigender Reihenfolge zu sortieren, müssen Sie diese Logik umkehren.

Bei 1 muss das zweite Element nach dem ersten kommen, und bei -1 muss das zweite Element

vor dem ersten stehen (bei 0 bleibt alles gleich). Schreiben Sie eine neue Vergleichsfunktion für

eine absteigende Reihenfolge:

function compareNumbersDesc(num1, num2) {

if (_____ > _____) {

return 1;

} else if (num1 === num2) {

return 0;

} else {

return -1;

}

}

Aufpassen! Die sort-Methode ist destruktiv. Das heißt, sie verändert

das Array selbst, anstatt ein neues sortiertes Array zurückzugeben.

Übung

Sie sind hier � 461

Funktionen erster Klasse

Zur gleichen Zeit bei Webville Cola

Jetzt können Sie Webville Cola mit Ihrem neuen Wissen zur Sortierung von

Arrays weiterhelfen. Dafür müssen Sie eigentlich nur eine Vergleichsfunktion

schreiben. Aber vorher wollen wir uns die Produkte noch einmal ansehen:

products.sort(compareSold);

function compareSold(colaA, colaB) {

if (colaA.sold > colaB.sold) {

return 1;

} else if (colaA.sold === colaB.sold) {

return 0;

} else {

return -1;

}

}

{ name: "Grapefruit", calories: 170, color: "Rot", sold: 8200 },

{ name: "Orange", calories: 160, color: "Orange", sold: 12101 },

{ name: "Cola", calories: 210, color: "Karamell", sold: 25412 },

{ name: "Diätcola", calories: 0, color: "Karamell", sold: 43922 },

{ name: "Zitrone", calories: 200, color: "Klar", sold: 14983 },

{ name: "Himbeere", calories: 180, color: "Lila", sold: 9427 },

{ name: "Malzbier", calories: 200, color: "Karamell", sold: 9909 },

{ name: "Wasser", calories: 0, color: "Klar", sold: 62123 }

Was sollen wir zuerst sortieren? Wir beginnen mit der Zahl der verkauften Flaschen in auf-

steigender Reihenfolge. Hierfür müssen wir die sold-Eigenschaft der einzelnen Objekte

miteinander vergleichen. Eines sollten Sie dabei bedenken: Da dies ein Array mit Objekten

ist, übergeben wir der Vergleichsfunktion nicht zwei Zahlen, sondern zwei Objekte:

Jedes Element im products-Array ist ein Objekt. Wir

wollen nicht die Objekte selbst vergleichen, sondern

bestimmte Objekt-Eigenschaften (z. B. sold).

compareSold übernimmt zwei

Produkt-Objekte und vergleicht die

sold-Eigenschaft von colaA mit der

sold-Eigenschaft von colaB.

Diese Funktion bringt die sort-

Methode dazu, die Getränke nach

verkauften Flaschen in aufsteigender

Reihenfolge zu sortieren.

Und um die compareSold-Funktion zu verwenden, brauchen wir nur die sort-

Methode des Arrays aufzurufen.

Wie gesagt, die sort-Methode kann für fast alle Arten von

Arrays (Zahlen, Strings, Objekte) und für beliebige Sortierungen

(aufsteigend, absteigend) benutzt werden. Durch die Übergabe einer

Vergleichsfunktion wird unser Code flexibel und wiederverwendbar.

Aber das sagen wir

natürlich nicht.

Vereinfachen Sie den Code wie in der

Übung auf Seite 459, wenn Sie wollen!