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

Если вы работаете с React, вам может понадобиться отсортировать массив объектов по определенным критериям. Сортировка массивов в React не сильно отличается от сортировки массивов в обычном JavaScript. В этом руководстве мы покажем вам, как сортировать массив объектов в React.

Шаг 1: Создайте массив объектов

Во-первых, нам нужно создать массив объектов, которые мы хотим отсортировать. Давайте создадим массив людей с их именами и возрастом.

const persons = [
  { name: "John", age: 25 },
  { name: "Jane", age: 30 },
  { name: "Peter", age: 20 },
  { name: "Mary", age: 35 }
];

Шаг 2: Определите функцию сортировки

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

Давайте определим функцию сортировки, которая сортирует массив лиц по возрасту в порядке возрастания:

function sortPersonsByAgeAscending(persons) {
  return persons.sort((a, b) => a.age - b.age);
}

Шаг 3: вызовите функцию сортировки

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

const sortedPersons = sortPersonsByAgeAscending(persons);
console.log(sortedPersons);

Это выведет отсортированный массив людей по возрасту в порядке возрастания:

[
  { name: "Peter", age: 20 },
  { name: "John", age: 25 },
  { name: "Jane", age: 30 },
  { name: "Mary", age: 35 }
]

Заключение

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