Поскольку мы все ненавидим блоги с рецептами, которые начинаются с горы историй, прежде чем они показывают настоящий рецепт, я начну этот блог с кода того, как на самом деле достичь желаемого результата, но надеюсь, что вы продолжите прокручивать, чтобы увидеть больше «Почему» метод работает именно так, а не просто «Как» это сделать.

В приведенных ниже примерах я буду вызывать метод .sort() для универсального массива, определенного как массив.

.sort() строка по длине строки (от меньшего к большему)

array.sort((a,b)=> a.length - b.length);

.sort() строка по длине строки (от большой к меньшей)

array.sort((a,b)=> b.length - a.length);

.sort() строка в алфавитном порядке

чтобы это работало правильно, вы должны убедиться, что строки каждого элемента массива не чувствительны к регистру. Ниже приведены примеры с учетом регистра.

array.sort();

.sort() строка в обратном алфавитном порядке

Есть более простой способ добиться этого, но об этом позже…

array.sort((a,b)=>{
       if (a>b){
           return -1;
       }
       if(a<b){
           return 1;
       }
       return 0;
   });

.sort() строка в алфавитном порядке, если элементы массива чувствительны к регистру.

array.sort((a,b)=>{
   let x = a.toUpperCase();
   let y = b.toUpperCase();
  
       if (x>y){
           return 1;
       }
       if(x<y){
           return -1;
       }
       return 0;
   });

.sort() строка в обратном алфавитном порядке, если элементы массива чувствительны к регистру

array.sort((a,b)=>{
   let x = a.toUpperCase();
   let y = b.toUpperCase();
  
       if (x>y){
           return -1;
       }
       if(x<y){
           return 1;
       }
       return 0;
   });

Хорошо… теперь, когда у нас это получилось. Вернемся на несколько шагов назад и поговорим о методе .sort() в целом.

Вот несколько важных характеристик метода .sort().

  1. Этот метод принимает необязательный аргумент, представляющий собой функцию, которая сравнивает элементы внутри массива, чтобы реорганизовать элементы определенным образом.
  2. Он упорядочивает элементы на месте, а затем возвращает отсортированный массив. Он также изменяет исходный массив.
  3. Метод .sort() преобразует элементы в строку и сравнивает строки для определения порядка.
  4. Синтаксис этого метода
array.sort(comparisonFunction);

5. По умолчанию .sort() будет упорядочивать от меньшего к большему. Если вы хотите изменить это, вам нужно изменить функцию сравнения, чтобы результат каждого сравнения отражал желаемый результат.

Функция сравнения…

принимает два аргумента, которые обычно обозначаются как A и B. При запуске функция сравнения сравнивает два элемента массива друг с другом. На основе этого сравнения функция возвращает значение (подробнее об этом ниже), а затем соответствующим образом сортирует массив. Затем он переходит к следующему элементу в массиве, сравнивая его с исходным элементом, и продолжает тот же процесс снова и снова, пока все элементы не будут сопоставлены друг с другом и массив не будет отсортирован соответствующим образом.

Возвращаемое значение функции сравнения основано на трех утверждениях «если».

  1. Если вы сравниваете A и B и это сравнение дает меньше нуля, функция сравнениявозвращает-1 и будет сортировать A по более низкому индексу, чем B
if (a<b){
  return -1
}

2. Если вы сравниваете A и B и это сравнение дает больше нуля, функция сравнениявозвращает 1 и отсортирует B по более низкому индексу, чем A

if (a>b){
  return 1
}

3. Если вы сравниваете A и B и это сравнение возвращает ноль, функция сравнениясчитает A и B должны быть равны, и позиция элементов останется неизменной.

Синтаксис «правил» функции сравнения можно упростить до…

(a,b)=> a - b

Эту логику легко увидеть на цифрах. Рассмотрим следующий пример…

Если бы мы вызвали метод .sort() для массива nums, функция сравнения началась бы с первых двух элементов (3 и 4) и сравните их на основе параметров функции сравнения

Шаги, которые выполняет функция сравнения, выглядят так…

  1. Сравните 3 с 4
  2. 3 меньше 4
  3. Возврат -1
  4. Сделать A (целое число 3) более низким индексом, чем B (целое число 4)

Поскольку A уже имеет более низкий индекс, чем B в этом случае, мы просто переходим к следующему сравнению

5. Теперь целое число 1 равно B в функции сравнения, поскольку мы продолжаем сравнивать A с каждым элементом в массиве.

6. Сравните 3 к 1

7. 3 больше 1

8. Возвращает 1

9. Сделайте B более низким индексом, чем A

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

10. Продолжайте работу с каждым элементом массива, пока A не станет следующим элементом массива, и продолжайте работу с каждым элементом массива.

К концу этой серии сравнений наш массив nums отсортирован, как показано во втором console.log().

Отказ от ответственности. Помните, что .sort() изменяет элементы на строку перед ее сравнением. Таким образом, приведенный выше пример не является общим для всех функций сравнения чисел. Чтобы узнать больше об этом, ознакомьтесь с ресурсом ЭТО и узнайте больше о конкретных сценариях использования . .sort(), а также узнать больше о Unicode и о том, как он влияет на значения сравниваемых объектов.

Теперь, когда мы лучше понимаем, что происходит в функции сравнения, давайте вернемся к разговору о том, как мы используем метод .sort() для строк.

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

array.sort((a,b)=> a.length - b.length);

Помните, что то, что здесь происходит под капотом, — это более подробный синтаксис этих трех параметров «если».

Если мы хотим упорядочить строки от наибольшего к наименьшему, мы просто обращаем логику функции сравнения (обратите внимание, что теперь это B — A)

array.sort((a,b)=> b.length - a.length);

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

 array.sort();

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

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

array.sort((a,b)=>{
       if (a>b){
           return -1;
       }
       if(a<b){
           return 1;
       }
       return 0;
   });

Есть гораздо более простой способ достижения той же цели, но я хотел использовать этот пример, чтобы подчеркнуть, как метод .sort() действует. Теперь, когда мы знаем, что на самом деле происходит внутри .sort(), мы можем просто добавить .reverse() метод, чтобы перевернуть элементы массива после того, как они были отсортированы по алфавиту, исключая функцию сравнения

array.sort().reverse();

В случаях, когда строки чувствительны к регистру, функция сравнения должна быть более подробной. Рассмотрим пример ниже

Обратите внимание, что «апельсин» и «арбуз» неправильно стоят перед «бананом».

Это опять же благодаря Юникоду. Не стесняйтесь читать больше об этом самостоятельно. А пока просто знайте, что A не равно a, и поэтому наша функция сравнения рассматривает их как имеющие разные значения. Чтобы бороться с этим и достичь нашей цели, нам нужно использовать более подробную функцию сравнения, чтобы изменить каждый строковый элемент в массиве на все прописные (или строчные) так, чтобы функция сравнения могла точно сравнить два и .sort() в алфавитном порядке

Теперь наши строки отсортированы по алфавиту, независимо от их заглавных букв.

Если мы хотим .sort()их в обратном алфавитном порядке, мы можем A) добавить .reverse(), как было показано ранее, или B) мы можем изменить возвращаемые значения.

Надеюсь это поможет!
С удовольствием .sort() -ing

-Андрей