Перейти к содержимому

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

  • автор:

Сортировка объекта в javascript

Этот объект с такой глубокой вложенностью, нужно отсортировать по полу sort_index , в итоге нужно получить такой объект:

data['params']['name']['property_erw'] = 'abcd'; data['params']['name']['sort_index'] = 5; data['params']['date']['property_xxc'] = 'abcd'; data['params']['date']['sort_index'] = 3; data['params']['last_name']['property_xxc'] = 'abcd'; data['params']['last_name']['sort_index'] = 2; 

Пробовал отсортировать с помощью sort() так:

var compareData = (a, b) =>< return a.sort_index - b.sort_index; >; 

Но, ничего не вышло. Подскажите как сделать такую сортировку?
Отслеживать
17.9k 5 5 золотых знаков 48 48 серебряных знаков 85 85 бронзовых знаков
задан 28 янв 2016 в 22:43
2,575 5 5 золотых знаков 30 30 серебряных знаков 54 54 бронзовых знака
А с чего вы решили, что ваш объект будет сортироваться методом sort ?
28 янв 2016 в 22:53
т.е. надо изменить порядок следования свойств в объекте. для чего это надо?
28 янв 2016 в 23:55

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

29 янв 2016 в 11:22

Первый и второй объекты у вас идентичны. Сортировка текстового представления нестабильна и когда-нибудь может привести к плавающему багу.

29 янв 2016 в 11:43

2 ответа 2

Сортировка: Сброс на вариант по умолчанию

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

Как следствие, если вы хотите сортировать ваши данные, то вам лучше сначала перейти от объекта к массиву, а уже потом выполнять сортировку, используя Array.prototype.sort . Это можно сделать, например, так:

var data = < 'params': [ < 'name': 'last_name', 'property_xxc': 'abcd', 'sort_index': 2 >, < 'name': 'name', 'property_erw': 'abcd', 'sort_index': 5 >, < 'name': 'date', 'property_xxc': 'abcd', 'sort_index': 3 >] > data.params.sort(function(a, b) < return a.sort_index - b.sort_index; >); console.dir(data); 

Отслеживать
ответ дан 28 янв 2016 в 22:59
Dmitriy Simushev Dmitriy Simushev
17.9k 5 5 золотых знаков 48 48 серебряных знаков 85 85 бронзовых знаков

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

29 янв 2016 в 9:00

@Grundy «скорее всего это php.» — в вопросе тег [javascript]. посмотрите мой ответ. добавил объяснение в начало.

29 янв 2016 в 9:04

@Stack, нужен комментарий автора. В любом случае, в ответе указана структура с которой нужно работать вместо той что указана в вопросе. Таким образом ваш первый комментарий выдрал строку из вопроса по заполнению объекта, а скорее всего тут просто показано чем равно конкретное поле, так как автор не догадался json выложить, а так же не указано что это за data и откуда получается, и я все больше уверен что это именно пример заполнения в php а не в яваскрипте, и пытается ее применить к другой структуре указанной в ответе, это не будет работать, так как структура изменена и уже заполнена.

29 янв 2016 в 9:13

Ваша структура данных — это не массив, а объект. В теме нет речи про массивы скорее всего код в вопросе работает, а также скорее всего это php метки смотрите к какому языку относится P.S. в массиве что приведена в данном ответе искревлена структура что есть в шапке

29 янв 2016 в 11:07

@sanu0074, да я видел, что нет упоминания о массиве. Но порядок следования ключей в объекте не гарантирован, следовательно нельзя говорить о сортировке

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

важность: 5

Напишите функцию sortByAge(users) , которая принимает массив объектов со свойством age и сортирует их по нему.

let vasya = < name: "Вася", age: 25 >; let petya = < name: "Петя", age: 30 >; let masha = < name: "Маша", age: 28 >; let arr = [ vasya, petya, masha ]; sortByAge(arr); // теперь: [vasya, masha, petya] alert(arr[0].name); // Вася alert(arr[1].name); // Маша alert(arr[2].name); // Петя
function sortByAge(arr) < arr.sort((a, b) =>a.age > b.age ? 1 : -1); > let vasya = < name: "Вася", age: 25 >; let petya = < name: "Петя", age: 30 >; let masha = < name: "Маша", age: 28 >; let arr = [ vasya, petya, masha ]; sortByAge(arr); // теперь отсортировано: [vasya, masha, petya] alert(arr[0].name); // Вася alert(arr[1].name); // Маша alert(arr[2].name); // Петя

Как делать сортировку в JavaScript при помощи sort()

В этой статье вы узнаете как делать сортировку в JavaScript при помощи метода sort() , не только обычную, как предполагает этот метод, а с задаваемыми параметрами и в самом конце вы узнаете как сортировать объекты, вложенные в массив по различным критериям.

Сортировка массивов в JavaScript делается через метод array.sort() , этот метод возможно также недооценен, как и неверно многими понимаем. Во время вызова sort() , сам по себе он сортирует массив в алфавитном порядке, но не всё так просто, если попытаться зайти дальше. Давайте более детально посмотрим на работу этого метода.

Сортировка массива в алфавитном порядке

Выполнить такую сортировку довольно просто. Просто вызовите array.sort() без любых параметров:

//Алфавитная сортировка в возрастающем порядке:var myarray=["Bob", "Bully", "Amy"]myarray.sort() // Массив становится ["Amy", "Bob", "Bully"]

Обратите внимание на возрастающий порядок. Чтобы сделать его убывающим, то самым простым способом тут будет применение другого метода для массивов в комбинации с sort() — это reverse() .

//Алфавитная сортировка в убывающем порядке:var myarray=["Bob", "Bully", "Amy"]myarray.sort()myarray.reverse() //Массив становится ["Bully", "Bob", "Amy"]

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

var myarray=[7, 40, 300]myarray.sort() //Теперь он становится таким [300,40,7]

Хотя 7 в численном порядке меньше, чем 40 или 300, в лексикографическом порядке, семёрка больше, таким образом она оказывается в правее всех в отсортированном массиве. Всегда имейте в виду, что по-дефолту array.sort() сортирует элементы в лексикографическом порядке.

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

Передаём функцию в array.sort()

Как говорилось выше, array.sort() допускает дополнительные параметры в виде функций (давайте назовем её sortfunction ). Формат такой функции будет выглядеть таким образом:

function sortfunction(a, b)//Тут можно сказать, что сравнивается a и b, и возвращается -1, 0 или 1.
>
array.sort(sortfunction)

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

В первом случае, когда меньше нуля, a отсортируется с индексом меньшими, чем b .

При нуле: a и b будут рассматриваться как равные и сортировка производиться не будет.

Больше нуля: Сортировка b будет меньшего индекса, чем a .

То есть, для того, чтобы сортировка прошла по числам и в возрастающем порядке, функция-параметр должна быть такой:

function sortfunction(a, b) return (a — b)
>

Сортируем массив в числовом порядке

Чтобы отсортировать массив в числовом порядке, просто передайте sortfunction к array.sort() , а затем возвратите разницу между a и b , оба параметра автоматически отправятся в функцию:

var myarray=[25, 8, 7, 41]
myarray.sort(function(a,b) <
return a — b
>) //Массив будет [7, 8, 25, 41]

Это работает так, как и должно работать, так как всякий раз когда a меньше, чем b , возвращается негативное значение, что ведет к тому, что меньший элемент всегда будет выставляться левее большего, а другими словами, порядок будет выстроен по возрастанию. Обратите внимание на то, что мы определили нашу функцию сортировки прямо внутри sort() , как анонимную, вместо того, чтобы создавать отдельную функцию и передавать ещё в sort() — оба варианта выдадут одинаковый результат.

Сортировка массива в числовом порядке, но по убывающей, отличается не многим и всего лишь требует реверса двух операндов a и b :

var myarray=[25, 8, 7, 41]
myarray.sort(function(a,b) <
return b — a
>) //Массив становится [41, 25, 8, 7]

Делаем случайный порядок у массива

Чтобы перетасовать элементы в массиве нам нужно, чтобы sortfunction возвращал 0 рандомно, независимо от того, что выдаст a и b. Вот небольшой трюк с этим делом:

//Рандомный порядок в массиве:var myarray=[25, 8, "George", "John"] 
myarray.sort(function() <
return 0.5 — Math.random()
>) //Теперь элементы перемешаны

Как вы видите у array.sort() есть тайные стороны. На самом деле, вы даже можете сортировать массивы, которые содержат не только примитивы, а объекты со свойствами. Давайте рассмотрим этот вариант:

Сортируем массив объектов

Сейчас мы пойдем дальше и предположим, что ваш массив содержит не только простые численные или строковые значения, а вместо них объекты со свойствами:

var employees=[]employees[0]= employees[1]= employees[2]= employees[3]=

Массив employees — это массив, состоящий из объектов со свойствами разного типа, от строк, чисел до дат (в данном случае строка с датой). Метод sort() можно использовать для сортировки массива, основываясь на значениях одного из свойств, например сортировке по имени, возрасту и в нашем случае, даже дате выхода на пенсию. В общем, тут идея довольно простая, вам нужно изменить функцию сравнения таким образом, что она сравнивала требуемые значения свойств. Давайте посмотрим как это работает.

Сортировка по возрасту

Итак, давайте начнем сортировать наш массив employees по возрасту сотрудников в возрастающем порядке. Вот функция сравнения, которая это сделает:

employees.sort(function(a, b) return a.age-b.age>)

С методом сортировки, указанным выше, наш массив теперь сортируется по свойству age (т.е. возраст). И таким образом, теперь у нас employee[0] это Edward, а employee[1] это George. Этот процесс очень похож на сортировку массива с числовыми значениями по возрастающей, но тут вместо вычета простого b из a , нам надо вычесть b.age из a.age , или иными словами свойство элемента, который мы хотим отсортировать.

Сортировка по имени

В наши дни сортировка по возрасту сотрудника может выглядеть довольно бесчувственной и некорректной, так что давайте отсортируем по именам сотрудников в возрастающем порядке. Вспомните, что по-дефолту, сортировка массива, который содержит примитивы, такие как строки, происходит в алфавитном порядке. Что говорит о том, что вам просто надо вызвать sort() метод, без любой функции сравнения, в общем просто myarray.sort() . Это не работает, так как данные по которым мы хотим отсортировать не являются массивом. Так что же делать? Фокус тут в том, чтобы вручную написать функцию сравнения, которая отсортирует массив по-алфавиту, что в свою очередь даст нам указать где находятся данные строк. Давайте посмотрим:

employees.sort(function(a, b)var nameA=a.name.toLowerCase(), nameB=b.name.toLowerCase()if (nameA < nameB) //сортируем строки по возрастанию return -1if (nameA > nameB) return 1return 0 // Никакой сортировки>)

Это отсортирует массив employees по именам в возрастающем порядке, так что теперь employee[0] это Christine, employee[1] это Edward и так далее. Тут мы сравниваем две строки a.name с b.name и возвращаем -1, 1 или 0, в соответствии с сортировкой, точно определенной формулой, которую использует сам sort() , без передачи какой-либо другой функции. Как вы уже наверное выяснили, в JavaScript вы можете без сомнений сравнивать две строки.

Сортировка по дате

И наконец, предположим, что вам нужно отсортировать сотрудников по их дате выхода на пенсию. Эта информация хранится в свойстве retiredate и чтобы сделать всё интереснее, это будет не объект с датой, а просто строка. Что нам нужно сделать первым делом, так это создать валидный объект даты из строки даты выхода на пенсию, хоть впоследствии процесс и будет таким же, как и сортировка по числам:

employees.sort(function(a, b)var dateA=new Date(a.retiredate), dateB=new Date(b.retiredate)return dateA-dateB //сортировка по возрастающей дате>)

Это отсортирует массив таким образом, что работник, выходящий на пенсию раньше всех, появится первым. employees[0] теперь будет Sarah. Это сработает, потому что JavaScript даст вам сравнить и/или сделать арифметические вычисления на объекте даты, который в первую очередь автоматически сконвертируется в числовой вид.

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

Мы хотим сделать этот проект с открытым исходным кодом доступным для людей во всем мире. Пожалуйста, помогите нам перевести это руководство на другие языки.

Светлая тема Тёмная тема
Поделиться

  • Учебник
  • Язык JavaScript
  • Продвинутая работа с функциями
  • Область видимости переменных, замыкание

Сортировать по полю

важность: 5

У нас есть массив объектов, который нужно отсортировать:

let users = [ < name: "John", age: 20, surname: "Johnson" >, < name: "Pete", age: 18, surname: "Peterson" >, < name: "Ann", age: 19, surname: "Hathaway" >];

Обычный способ был бы таким:

// по имени (Ann, John, Pete) users.sort((a, b) => a.name > b.name ? 1 : -1); // по возрасту (Pete, Ann, John) users.sort((a, b) => a.age > b.age ? 1 : -1);

Можем ли мы сделать его короче, например вот таким?

users.sort(byField('name')); users.sort(byField('age'));

То есть чтобы вместо функции мы просто писали byField(fieldName) .

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

function byField(fieldName) < return (a, b) =>a[fieldName] > b[fieldName] ? 1 : -1; >

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *