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