Sorting an Array
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;
}