Lesson 24: Sorting Arrays
Master array sorting techniques in JavaScript to organize your data efficiently.
24.1 Sorting Arrays in JavaScript
In this lesson, we'll learn how to sort arrays using JavaScript's built-in sort()
method. Sorting is essential for organizing data and making it easier to analyze and present.
sort()
method sorts elements as strings by default. To sort numbers correctly, we need to provide a comparator function.
24.2 Understanding the Comparator Function
The comparator function determines the sorting order by comparing two elements:
- Returns a negative value if the first element should come before the second
- Returns zero if elements are equal
- Returns a positive value if the first element should come after the second
Example 24.1: Sorting Numbers with Comparator
This example demonstrates sorting an array of student scores:
function sortScores() { const scores = [50, 60, 65, 75, 80, 68, 70, 85]; // Create a copy to avoid modifying original const sortedScores = [...scores]; // Sort with comparator function sortedScores.sort((a, b) => a - b); return sortedScores; }
24.3 Sorting Strings
Sorting strings is straightforward as the default behavior works well for alphabetical sorting:
Example 24.2: Sorting Student Names
This example sorts an array of student names alphabetically:
function sortNames() { const studentNames = [ "Alex", "Brian", "Carmen", "Dave", "Graham", "Keynes", "Morgan", "Olson" ]; // Create a copy to avoid modifying original const sortedNames = [...studentNames]; // Sort alphabetically sortedNames.sort(); return sortedNames; }
24.4 Descending Order
To sort in descending order, we simply reverse the comparator logic:
Example 24.3: Sorting Scores Descending
This example sorts student scores from highest to lowest:
function sortScoresDescending() { const scores = [50, 60, 65, 75, 80, 68, 70, 85]; // Create a copy to avoid modifying original const sortedScores = [...scores]; // Sort in descending order sortedScores.sort((a, b) => b - a); return sortedScores; }
24.5 Sorting Complex Data
We can sort arrays of objects based on specific properties:
Example 24.4: Sorting Students by Score
This example sorts an array of student objects by their scores:
function sortStudentsByScore() { const students = [ { name: "Alex", score: 50 }, { name: "Brian", score: 60 }, { name: "Carmen", score: 65 }, { name: "Dave", score: 75 }, { name: "Graham", score: 80 }, { name: "Keynes", score: 68 }, { name: "Morgan", score: 70 }, { name: "Olson", score: 85 } ]; // Create a copy to avoid modifying original const sortedStudents = [...students]; // Sort by score property sortedStudents.sort((a, b) => a.score - b.score); return sortedStudents; }
sort()
method modifies the original array.
24.6 Common Sorting Mistakes
Avoid these common mistakes when sorting arrays:
Example 24.5: Incorrect Number Sorting
This example shows what happens when you sort numbers without a comparator:
function incorrectSort() { const numbers = [10, 5, 100, 2, 1000]; // Create a copy to avoid modifying original const sortedNumbers = [...numbers]; // Sort without comparator (incorrect for numbers) sortedNumbers.sort(); return sortedNumbers; }