17

Сортировка массива объектов по значениям свойств

15

У меня есть массив объектов, полученных с помощью AJAX:

var homes = [
    {
        "h_id": "3",
        "city": "Dallas",
        "state": "TX",
        "zip": "75201",
        "price": "162500"
    }, {
        "h_id": "4",
        "city": "Bevery Hills",
        "state": "CA",
        "zip": "90210",
        "price": "319250"
    }, {
        "h_id": "5",
        "city": "New York",
        "state": "NY",
        "zip": "00010",
        "price": "962500"
    }
];

Как мне создать функцию, которая будет сортировать объекты по свойству price в возрастающем или убывающем порядке, используя только JavaScript?

5 ответ(ов)

7

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

const sort_by = (field, reverse, primer) => {

  const key = primer ?
    function(x) {
      return primer(x[field])
    } :
    function(x) {
      return x[field]
    };

  reverse = !reverse ? 1 : -1;

  return function(a, b) {
    return a = key(a), b = key(b), reverse * ((a > b) - (b > a));
  }
}

// Теперь вы можете сортировать по любому полю на ваше усмотрение...

const homes=[{h_id:"3",city:"Dallas",state:"TX",zip:"75201",price:"162500"},{h_id:"4",city:"Bevery Hills",state:"CA",zip:"90210",price:"319250"},{h_id:"5",city:"New York",state:"NY",zip:"00010",price:"962500"}];

// Сортировка по цене от высокой к низкой
console.log(homes.sort(sort_by('price', true, parseInt)));

// Сортировка по городу, без учета регистра, от A до Z
console.log(homes.sort(sort_by('city', false, (a) =>  a.toUpperCase())));

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

1

Чтобы отсортировать массив объектов, вам нужно создать функцию сравнения, принимающую два аргумента. Затем вызовите функцию сортировки, передав ей эту функцию сравнения следующим образом:

// a и b - это объекты в вашем массиве
function mycomparator(a, b) {
  return parseInt(a.price, 10) - parseInt(b.price, 10);
}
homes.sort(mycomparator);

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

0

Вот пример кода для сортировки строк в JavaScript, если кому-то это может понадобиться:

const dataArr = {
  "hello": [{
    "id": 114,
    "keyword": "zzzzzz",
    "region": "Шри-Ланка",
    "supportGroup": "администраторы",
    "category": "Категория2"
  }, {
    "id": 115,
    "keyword": "aaaaa",
    "region": "Япония",
    "supportGroup": "разработчики",
    "category": "Категория2"
  }]
};

const sortArray = dataArr['hello'];

console.log(sortArray.sort((a, b) => {
  if (a.region < b.region)
    return -1;
  if (a.region > b.region)
    return 1;
  return 0;
}));

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

0

Давайте разберем предложенный вами код для сортировки массивов на JavaScript.

Ваш метод getSortedData принимает три аргумента: data — массив объектов, prop — название свойства, по которому будет производиться сортировка, и isAsc — булевый флаг, указывающий, нужно ли сортировать по возрастанию (true) или по убыванию (false).

Вот как работает ваша функция:

function getSortedData(data, prop, isAsc) {
    return data.sort((a, b) => {
        return (a[prop] < b[prop] ? -1 : 1) * (isAsc ? 1 : -1);
    });
}
  1. Сравнение объектов: Внутри функции используется метод sort для сортировки массива data. Сравнение выполняется с помощью стрелочной функции (a, b) => { ... }.

  2. Сравнение свойств: Для каждого объекта a и b проверяется значение их свойства prop. Если a[prop] < b[prop], то результат будет -1, иначе 1. Это обеспечивает правильный порядок сортировки по возрастанию.

  3. Учет порядка: Далее результат этого сравнения умножается на 1 или -1 в зависимости от значения isAsc. Если isAsc равно true, то результат останется без изменений. Если isAsc равно false, порядок изменится на противоположный.

Обратите внимание на важный момент: если значения a[prop] и b[prop] равны, ваш код не возвращает 0, что может привести к некорректной сортировке в случае таких объектов. Чтобы исправить это, вы можете использовать условие, которое возвращает 0, когда значения равны. Вот улучшенная версия функции:

function getSortedData(data, prop, isAsc) {
    return data.sort((a, b) => {
        if (a[prop] < b[prop]) return isAsc ? -1 : 1;
        if (a[prop] > b[prop]) return isAsc ? 1 : -1;
        return 0; // Если значения равны
    });
}

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

0

Вот сводка всех ответов выше.

Валидация Fiddle: http://jsfiddle.net/bobberino/4qqk3/

var sortOn = function (arr, prop, reverse, numeric) {

    // Убедимся, что имеется свойство
    if (!prop || !arr) {
        return arr;
    }

    // Настраиваем функцию сортировки
    var sort_by = function (field, rev, primer) {

        // Возвращаем требуемую функцию a,b
        return function (a, b) {

            // Сбрасываем a и b к нужному полю
            a = primer(a[field]), b = primer(b[field]);

            // Выполняем фактическую сортировку, переворачиваем при необходимости
            return ((a < b) ? -1 : ((a > b) ? 1 : 0)) * (rev ? -1 : 1);
        }

    }

    // Различаем числовые и строковые значения, чтобы предотвратить,
    // например, появление 100 перед меньшими числами.
    // Например:
    // 1
    // 20
    // 3
    // 4000
    // 50

    if (numeric) {

        // Сортируем "на месте" с помощью функции sort_by
        arr.sort(sort_by(prop, reverse, function (a) {

            // - Принудительно приводим значение к строке.
            // - Заменяем любые нечисловые символы.
            // - Парсим как число с плавающей точкой для обработки значений 0.02.
            return parseFloat(String(a).replace(/[^0-9.-]+/g, ''));

        }));
    } else {

        // Сортируем "на месте" с помощью функции sort_by
        arr.sort(sort_by(prop, reverse, function (a) {

            // - Принудительно приводим значение к строке.
            return String(a).toUpperCase();

        }));
    }

}

Этот код позволяет сортировать массив объектов по заданному свойству, учитывая возможность сортировки по числовым и строковым значениям, а также возможность сортировки в обратном порядке. Если вам нужно больше деталей или конкретные примеры его использования, пожалуйста, дайте знать.

Чтобы ответить на вопрос, пожалуйста, войдите или зарегистрируйтесь