Как отсортировать массив объектов в javascript

Как сделать сортировку массива объектов по ключу js

Чтобы сделать сортировку объектов по ключу, можно воспользоваться тем же методом, как и при обычной сортировке, используя метод sort . Только теперь нужно сравнивать значения в объектах по ключу:

const users = [  name: 'Name2', age: 23, >,  name: 'Name3', age: 34, >,  name: 'Name1', age: 12, >, ]; const key = 'age'; // ключ, по которому будем сортировать const sorted = users.sort((user1, user2) => user1[key] > user2[key] ? 1 : -1); console.log(sorted); // проверяем результат

05 апреля 2023

Для сортировки массива объектов по ключу с использованием библиотеки Lodash :

const _ = require('lodash'); const cars = [  make: 'Toyota', model: 'Camry', year: 2018 >,  make: 'Honda', model: 'Accord', year: 2019 >,  make: 'Tesla', model: 'Model S', year: 2020 >,  make: 'Ford', model: 'Mustang', year: 2017 >, ]; const sortedCars = _.sortBy(cars, ['year']); console.log(sortedCars);

В этом примере мы создали массив объектов cars , содержащий информацию о машинах, а затем отсортировали его по ключу year с помощью метода _.sortBy() . Результат сортировки мы записали в переменную sortedCars и вывели ее в консоль.

Array.prototype.sort()

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

Синтаксис

arr.sort([compareFunction])

Параметры

Необязательный параметр. Указывает функцию, определяющую порядок сортировки. Если опущен, массив сортируется в соответствии со значениями кодовых точек каждого символа Unicode, полученных путём преобразования каждого элемента в строку.

Возвращаемое значение

Отсортированный массив. Важно, что копия массива не создаётся — массив сортируется на месте.

Описание

Если функция сравнения compareFunction не предоставляется, элементы сортируются путём преобразования их в строки и сравнения строк в порядке следования кодовых точек Unicode. Например, слово «Вишня» идёт перед словом «бананы». При числовой сортировке, 9 идёт перед 80, но поскольку числа преобразуются в строки, то «80» идёт перед «9» в соответствии с порядком в Unicode.

var fruit = ["арбузы", "бананы", "Вишня"]; fruit.sort(); // ['Вишня', 'арбузы', 'бананы'] var scores = [1, 2, 10, 21]; scores.sort(); // [1, 10, 2, 21] var things = ["слово", "Слово", "1 Слово", "2 Слова"]; things.sort(); // ['1 Слово', '2 Слова', 'Слово', 'слово'] // В Unicode, числа находятся перед буквами в верхнем регистре, // а те, в свою очередь, перед буквами в нижнем регистре.

Если функция сравнения compareFunction предоставлена, элементы массива сортируются в соответствии с её возвращаемым значением. Если сравниваются два элемента a и b , то:

Если compareFunction(a, b) меньше 0, сортировка поставит a по меньшему индексу, чем b , то есть, a идёт первым.
Если compareFunction(a, b) вернёт 0, сортировка оставит a и b неизменными по отношению друг к другу, но отсортирует их по отношению ко всем другим элементам. Обратите внимание: стандарт ECMAscript не гарантирует данное поведение, и ему следуют не все браузеры (например, версии Mozilla по крайней мере, до 2003 года).
Если compareFunction(a, b) больше 0, сортировка поставит b по меньшему индексу, чем a .
Функция compareFunction(a, b) должна всегда возвращать одинаковое значение для определённой пары элементов a и b . Если будут возвращаться непоследовательные результаты, порядок сортировки будет не определён.

Итак, функция сравнения имеет следующую форму:

function compare(a, b)  if (a меньше b по некоторому критерию сортировки)  return -1; > if (a больше b по некоторому критерию сортировки)  return 1; > // a должно быть равным b return 0; >

Для числового сравнения, вместо строкового, функция сравнения может просто вычитать b из a . Следующая функция будет сортировать массив по возрастанию:

function compareNumbers(a, b)  return a - b; >

Метод sort можно удобно использовать с функциональными выражениями (и замыканиями):

var numbers = [4, 2, 5, 1, 3]; numbers.sort(function (a, b)  return a - b; >); console.log(numbers); // [1, 2, 3, 4, 5]

Объекты могут быть отсортированы по значению одного из своих свойств.

var items = [  name: "Edward", value: 21 >,  name: "Sharpe", value: 37 >,  name: "And", value: 45 >,  name: "The", value: -12 >,  name: "Magnetic" >,  name: "Zeros", value: 37 >, ]; items.sort(function (a, b)  if (a.name > b.name)  return 1; > if (a.name  b.name)  return -1; > // a должно быть равным b return 0; >);

Примеры

Пример: создание, отображение и сортировка массива

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

var stringArray = ["Голубая", "Горбатая", "Белуга"]; var numericStringArray = ["80", "9", "700"]; var numberArray = [40, 1, 5, 200]; var mixedNumericArray = ["80", "9", "700", 40, 1, 5, 200]; function compareNumbers(a, b)  return a - b; > // снова предполагаем, что функция печати определена console.log("stringArray:", stringArray.join()); console.log("Сортировка:", stringArray.sort()); console.log("numberArray:", numberArray.join()); console.log("Сортировка без функции сравнения:", numberArray.sort()); console.log( "Сортировка с функцией compareNumbers:", numberArray.sort(compareNumbers), ); console.log("numericStringArray:", numericStringArray.join()); console.log("Сортировка без функции сравнения:", numericStringArray.sort()); console.log( "Сортировка с функцией compareNumbers:", numericStringArray.sort(compareNumbers), ); console.log("mixedNumericArray:", mixedNumericArray.join()); console.log("Сортировка без функции сравнения:", mixedNumericArray.sort()); console.log( "Сортировка с функцией compareNumbers:", mixedNumericArray.sort(compareNumbers), );

Этот пример произведёт следующий вывод. Как показывает вывод, когда используется функция сравнения, числа сортируются корректно вне зависимости от того, являются ли они собственно числами или строками с числами.

stringArray: Голубая,Горбатая,Белуга Сортировка: Белуга,Голубая,Горбатая numberArray: 40,1,5,200 Сортировка без функции сравнения: 1,200,40,5 Сортировка с функцией compareNumbers: 1,5,40,200 numericStringArray: 80,9,700 Сортировка без функции сравнения: 700,80,9 Сортировка с функцией compareNumbers: 9,80,700 mixedNumericArray: 80,9,700,40,1,5,200 Сортировка без функции сравнения: 1,200,40,5,700,80,9 Сортировка с функцией compareNumbers: 1,5,9,40,80,200,700

Пример: сортировка не-ASCII символов

Для сортировки строк с не-ASCII символами, то есть строк с символами акцента (e, é, è, a, ä и т.д.), строк, с языками, отличными от английского: используйте String.localeCompare . Эта функция может сравнивать эти символы, чтобы они становились в правильном порядке.

var items = ["réservé", "premier", "cliché", "communiqué", "café", "adieu"]; items.sort(function (a, b)  return a.localeCompare(b); >); // items равен ['adieu', 'café', 'cliché', 'communiqué', 'premier', 'réservé']

Пример: сортировка c помощью map

Функция сравнения (compareFunction) может вызываться несколько раз для каждого элемента в массиве. В зависимости от природы функции сравнения, это может привести к высоким расходам ресурсов. Чем более сложна функция сравнения и чем больше элементов требуется отсортировать, тем разумнее использовать map для сортировки. Идея состоит в том, чтобы обойти массив один раз, чтобы извлечь фактические значения, используемые для сортировки, во временный массив, отсортировать временный массив, а затем обойти временный массив для получения правильного порядка.

// массив для сортировки var list = ["Дельта", "альфа", "ЧАРЛИ", "браво"]; // временный массив содержит объекты с позицией и значением сортировки var mapped = list.map(function (el, i)  return  index: i, value: el.toLowerCase() >; >); // сортируем массив, содержащий уменьшенные значения mapped.sort(function (a, b)  if (a.value > b.value)  return 1; > if (a.value  b.value)  return -1; > return 0; >); // контейнер для результа var result = mapped.map(function (el)  return list[el.index]; >);

Спецификации

Specification
ECMAScript Language Specification # sec-array.prototype.sort

Совместимость с браузерами

BCD tables only load in the browser

Смотрите также

Array.prototype.reverse()
String.prototype.localeCompare()