sort() сортирует элементы массива.
Это очень полезный метод, но у него есть две важные особенности:
- по умолчанию элементы сравниваются как строки
- метод меняет исходный массив
Синтаксис
array.sort()
array.sort(compareFn)
compareFn - необязательная функция сравнения.
Что делает sort()
Метод переставляет элементы массива в новом порядке.
const letters = ["c", "a", "b"];
letters.sort();
console.log(letters); // ["a", "b", "c"]
sort() меняет исходный массив
sort() работает прямо с исходным массивом, а не создаёт новый.
const numbers = [3, 1, 2];
numbers.sort();
console.log(numbers); // [1, 2, 3]
Это главный момент, который важно запомнить про метод.
Что возвращает sort()
sort() возвращает сам изменённый массив.
const numbers = [3, 1, 2];
const result = numbers.sort();
console.log(result); // [1, 2, 3]
console.log(numbers); // [1, 2, 3]
Но это не новый массив, а тот же самый.
По умолчанию сортировка идёт как у строк
Если не передать функцию сравнения, элементы приводятся к строкам и сравниваются как текст.
const numbers = [1, 2, 10, 5];
numbers.sort();
console.log(numbers); // [1, 10, 2, 5]
Для новичков это один из самых неожиданных моментов в sort().
Причина в том, что "10" сравнивается со "2" как строка, а не как число.
Как сортировать числа правильно
Для чисел обычно передают функцию сравнения:
const numbers = [1, 2, 10, 5];
numbers.sort((a, b) => a - b);
console.log(numbers); // [1, 2, 5, 10]
Это стандартный способ сортировки по возрастанию.
Сортировка по убыванию
Для обратного порядка обычно меняют вычитание местами:
const numbers = [1, 2, 10, 5];
numbers.sort((a, b) => b - a);
console.log(numbers); // [10, 5, 2, 1]
Как работает compareFn
Функция сравнения получает два элемента массива:
array.sort((a, b) => {
// ...
});
Она должна вернуть:
- число меньше
0, еслиaдолжен идти раньшеb - число больше
0, еслиaдолжен идти позжеb 0, если их порядок можно не менять
Пример:
const numbers = [3, 1, 2];
numbers.sort((a, b) => a - b);
console.log(numbers); // [1, 2, 3]
Сортировка строк
Для простых строк sort() без compareFn часто уже работает нормально:
const fruits = ["banana", "apple", "orange"];
fruits.sort();
console.log(fruits); // ["apple", "banana", "orange"]
Но если нужна более точная сортировка с учётом языка, часто используют localeCompare().
const words = ["ёж", "яблоко", "арбуз"];
words.sort((a, b) => a.localeCompare(b, "ru"));
console.log(words); // ["арбуз", "ёж", "яблоко"]
Сортировка массива объектов
Очень часто sort() используют для объектов.
const users = [
{ name: "Ivan", age: 30 },
{ name: "Anna", age: 25 },
];
users.sort((a, b) => a.age - b.age);
console.log(users);
// [{ name: "Anna", age: 25 }, { name: "Ivan", age: 30 }]
Здесь сортировка идёт по полю age.
Как сохранить исходный массив
Если нужен новый отсортированный массив без изменения старого, сначала делают копию.
const numbers = [3, 1, 2];
const sorted = [...numbers].sort((a, b) => a - b);
console.log(numbers); // [3, 1, 2]
console.log(sorted); // [1, 2, 3]
Ещё для этого можно использовать toSorted().
sort() и toSorted()
Эти методы похожи, но работают по-разному.
const numbers = [3, 1, 2];
const sorted = numbers.toSorted((a, b) => a - b);
console.log(numbers); // [3, 1, 2]
console.log(sorted); // [1, 2, 3]
sort() меняет исходный массив.
toSorted() возвращает новый.
Пустые слоты
sort() сохраняет пустые слоты, но обычно переносит их в конец массива.
const arr = [3, , 1, 2];
arr.sort();
console.log(arr); // [1, 2, 3, empty]
Это ещё один нюанс, который иногда выглядит неожиданно.
Когда это полезно
sort() удобно использовать, когда:
- нужно отсортировать массив строк
- нужно отсортировать числа через compareFn
- нужно упорядочить массив объектов по какому-то полю
- изменение исходного массива допустимо
Частые ошибки
Сортировать числа без compareFn
const numbers = [1, 2, 10, 5];
numbers.sort();
console.log(numbers); // [1, 10, 2, 5]
Без функции сравнения числа сортируются не так, как обычно ожидают.
Думать, что sort() создаёт новый массив
const numbers = [3, 1, 2];
numbers.sort();
console.log(numbers); // [1, 2, 3]
Метод меняет исходный массив.
Возвращать из compareFn true или false
const numbers = [3, 1, 2];
numbers.sort((a, b) => a > b);
Так писать не стоит. compareFn должна возвращать отрицательное число, положительное число или 0.
Быстрая памятка
sort()сортирует массив и меняет его на месте- без
compareFnэлементы сравниваются как строки - для чисел обычно используют
(a, b) => a - b sort()возвращает тот же самый массив- если нужен новый массив, можно сначала сделать копию или использовать
toSorted()
Коротко
sort() - это стандартный способ отсортировать массив в JavaScript. Главное, что стоит запомнить: без функции сравнения метод может неожиданно сортировать числа как строки, а сам массив при этом изменяется.