Сортировка алфанумерических строк в JavaScript: '19asd' < '123asd'

Быстрый ответ

Чтобы отсортировать алфавитно-цифровые строки естественным способом, примените метод localeCompare с параметром { numeric: true }:

const numsAndStringsSort = (a, b) => a.localeCompare(b, undefined, { numeric: true });

// Пример использования:
const items = ['item1', 'item12', 'item2'];
console.log(items.sort(numsAndStringsSort)); // Результат: ['item1', 'item2', 'item12']

Данный подход обеспечит логичность и понятность сортировки, что будет естественно восприниматься пользователем.

Увеличение производительности с помощью Intl.Collator

Для работы с большими объемами данных важно обеспечить производительность. Чтобы ускорить процесс сортировки, нужно использовать объект Intl.Collator:

const collator = new Intl.Collator(undefined, {numeric: true, sensitivity: 'base'});
const collatorSort = (a, b) => collator.compare(a, b);

// Пример использования на большом массиве:
const largeItems = [/* код гигантского массива */];
console.log(largeItems.sort(collatorSort)); // Скорость сортировки волшебным образом увеличивается!

Этот метод улучшает время сортировки, что актуально при обработке больших массивов данных.

Точная сортировка с применением регулярных выражений

Если требуется высокая точность сортировки, можно применить регулярные выражения:

const precisionSort = (a, b) => a.replace(/^(\d+)/, '000$1').slice(-4)
                                  .localeCompare(b.replace(/^(\d+)/, '000$1').slice(-4), undefined, {numeric: true});

// Пример использования:
const mixedItems = ['2files', '10files', '1file'];
console.log(mixedItems.sort(precisionSort)); // Результат: ["1file", "2files", "10files"]

Сортировка с игнорированием регистра

Чтобы отсортировать строки без учета регистра, используйте параметр sensitivity: 'base':

const caseInsensitiveSort = (a, b) => a.localeCompare(b, undefined, { numeric: true, sensitivity: 'base' });

// Пример использования:
const mixedCaseItems = ['Item1', 'item2', 'item10', 'Item12'];
console.log(mixedCaseItems.sort(caseInsensitiveSort)); // Результат: ['Item1', 'item2', 'item10', 'Item12']

Применение библиотек для различной сортировки

Если нужно комплексное решение для сортировки, могут оказаться полезными библиотеки, например, natural-orderby:

import { orderBy } from 'natural-orderby';

const items = ['1item', '10item', '2item'];
console.log(orderBy(items, [(value) => value ])); // Используем функционал библиотеки

При сжатом графике использование специализированных библиотек может существенно экономить время и ресурсы.

Визуализация

Представьте, что вы размещаете книги на полке, учитывая не только названия, но и номера томов, как это делает внимательный и аккуратный библиотекарь:

До сортировки: ["а2", "а10", "а1"]
// Неопытный библиотекарь сортирует все просто по алфавиту.

После сортировки: ["а1", "а2", "а10"]
// Профессиональный библиотекарь упорядочивает с учетом номеров.

Естественная сортировка достигается, когда буквы и цифры сочетаются так, наиболее соответствуя повседневной логике.

Обеспечение совместимости с браузерами

Методы localeCompare и Intl.Collator поддерживаются во всех актуальных браузерах, таких как Chrome, Firefox, IE11. Тем не менее, важно провести тестирование в тех браузерах, с которыми работает ваша целевая аудитория:

// Проверяем результаты сортировки в предполагаемой среде
console.log(['item1', 'item12', 'item2'].sort(numsAndStringsSort)); // [[ Ожидаем результата...]]

Помните, что сортировка больших массивов может замедлять производительность. В этих случаях подход к решению задачи может быть изменен или может быть выбрана специализированная библиотека.

Получение стабильных результатов через валидацию ввода

Проверка вводимых данных часто является защитой от неожиданных результатов:

const isValidItem = item => typeof item === 'string' && item.trim() !== '';
const validatedItems = items.filter(isValidItem);

console.log(validatedItems.sort(numsAndStringsSort)); // Все идет согласно плану: результаты предсказуемы

Валидация позволяет убедиться, что входящие данные соответствуют вашим требованиям, и обеспечивает надежность и стабильность процедуры сортировки.

Полезные материалы

1. Array.prototype.sort() – JavaScript | MDN — Документация метода Array.prototype.sort().
2. GitHub – overset/javascript-natural-sort: Сортировка "по-человечески" на JavaScript — Примеры естественной сортировки, демонстрирующие всю ее мощь.
3. Отточенная сортировка на JavaScript — SitePoint — Глубокое изучение различных аспектов естественной сортировки на JavaScript.
4. string-natural-compare – npm — Пакет для естественной сортировки строк, доступный в npm.
5. Естественная сортировка на JavaScript — Обучающий мануал по естественной сортировке на TutorialsPoint.
6. JSFiddle – Среда для экспериментов с кодом — Проверьте и протестируйте ваш код на JavaScript в JSFiddle.
7. Intl.Collator – JavaScript | MDN — Подробные данные о Intl.Collator, расширяющем возможности сортировки.