Menu
Coddy logo textTech

Метод Sort

Часть раздела Логика и поток путешествия по JavaScript на Coddy. Урок 57 из 65.

Метод sort() позволяет сортировать элементы массива на месте и возвращает отсортированный массив. По умолчанию он сортирует элементы как строки в алфавитном порядке и по возрастанию.

Вот базовый синтаксис:

array.sort([compareFunction])

Пример без использования функции сравнения:

const fruits = ['banana', 'apple', 'orange', 'mango'];
fruits.sort();
console.log(fruits);
// ['apple', 'banana', 'mango', 'orange']

ВНИМАНИЕ: Числа не сортируются так, как ожидается, без функции сравнения:

const numbers = [1, 30, 4, 21, 100000];
numbers.sort();
console.log(numbers);
// [1, 100000, 21, 30, 4] (неправильная числовая сортировка)

Чтобы правильно сортировать числа или реализовать пользовательскую сортировку, вам нужно использовать функцию сравнения.

Функция сравнения должна возвращать:

  • Отрицательное значение, если a должно идти перед b
  • Положительное значение, если b должно идти перед a
  • Ноль, если они равны

Вот как можно отсортировать числа с помощью функции сравнения:

// По возрастанию
const numbers = [1, 30, 4, 21, 100000];
numbers.sort((a, b) => a - b);
console.log(numbers); // [1, 4, 21, 30, 100000]
// По убыванию
numbers.sort((a, b) => b - a);
console.log(numbers); // [100000, 30, 21, 4, 1]

Ещё один пример сортировки объектов:

const people = [
    { name: 'John', age: 30 },
    { name: 'Alice', age: 25 },
    { name: 'Bob', age: 35 }
];

// Сортировка по возрасту (по возрастанию)
people.sort((a, b) => a.age - b.age);
// Сортировать по имени (алфавитно использовать localeCompare())
people.sort((a, b) => a.name.localeCompare(b.name));
challenge icon

Задание

Легко

Создайте функцию с именем sortByLength, которая принимает массив строк и возвращает новый массив с теми же строками, отсортированными по их длине в порядке возрастания. Если две строки имеют одинаковую длину, их следует отсортировать по алфавиту.

Попробуйте сами

function sortByLength(arr) {
    return arr.sort((a, b) => {
        // Напишите код здесь
    })
}
quiz iconПроверьте себя

В этом уроке есть небольшой тест. Начните урок, чтобы ответить на вопросы и сохранить прогресс.

Все уроки раздела Логика и поток

Потренируйтесь самостоятельно: Онлайн-компилятор JavaScript