Сортировать по атрибуту, а затем по двум другим атрибутам в JavaScript

Question

У меня есть массив объектов, каждый из которых имеет следующие атрибуты:

• идентификатор (номер)
• isBlue (ДОПОЛНИТЕЛЬНО true или false)
• isRed (НЕОБЯЗАТЕЛЬНО true или false)
• рейтинг (ДОПОЛНИТЕЛЬНЫЙ номер - 1 является более приоритетным, чем 2 -)
• createAt (дата в строковом формате '2012-02-01')

Я хочу иметь возможность упорядочить объекты в этих массивах так, чтобы сначала они отображались синими, затем с красными и, наконец, с синими или красными. Затем, внутри каждой «категории» по цвету, я хочу упорядочить по рангу, а затем по возрастанию (самый старый появляется первым).

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

Пример ввода:

[ 
{ id: 5, isBlue: false, isRed: true, ranking: 3, createdAt:
'2010-01-20' }, 
{ id: 3, isBlue: false, isRed: true, ranking: 3,
createdAt: '2010-01-23' }, 
{ id: 2, isBlue: false, isRed: true,
ranking: 2, createdAt: '2012-01-23' }, 
{ id: 16, isBlue: false, isRed:
false, ranking: 1, createdAt: '2014-01-23' }, 
{ id: 1, isBlue: true,
isRed: false, ranking: null, createdAt: '2014-01-23' },  
{ id: 10,isBlue: true, isRed: false, ranking: 3, createdAt: '2012-01-23'}
 ]

Ожидаемый результат будет:

[
 { id: 10,isBlue: true, isRed: false, ranking: 3, createdAt: '2012-01-23'},
 { id: 1, isBlue: true,
isRed: false, ranking: null, createdAt: '2014-01-23' },
{ id: 2, isBlue: false, isRed: true,
ranking: 2, createdAt: '2012-01-23' },
{ id: 5, isBlue: false, isRed: true, ranking: 3, createdAt:
'2010-01-20' },
{ id: 3, isBlue: false, isRed: true, ranking: 3,
createdAt: '2010-01-23' }, 
{ id: 16, isBlue: false, isRed:
false, ranking: 1, createdAt: '2014-01-23' }, 
]

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

Answer 1

вы сортируете цепочку от наименее релевантного к наиболее релевантному, например:

var arr = [{ id: 5, isBlue: false, isRed: true, ranking: 3, createdAt:'2010-01-20' }, 
{ id: 3, isBlue: false, isRed: true, ranking: 3, createdAt: '2010-01-23' }, 
{ id: 2, isBlue: false, isRed: true, ranking: 2, createdAt: '2012-01-23' }, 
{ id: 16, isBlue: false, isRed:false, ranking: 1, createdAt: '2014-01-23' }, 
{ id: 1, isBlue: true, isRed: false, ranking: null, createdAt: '2014-01-23' },  
{ id: 10,isBlue: true, isRed: false, ranking: 3, createdAt: '2012-01-23'} ];


    arr.sort((a,b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime())
    .sort((a,b) => (b.ranking || 0) - (a.ranking || 0))
    .sort((a,b) => (a.isRed === b.isRed) ? 0 : a.isRed ? -1 : 1)
    .sort((a,b) => (a.isBlue === b.isBlue) ? 0 : a.isBlue ? -1 : 1);
    
    console.log(arr)

Answer 2

const rows = [ 
{ id: 5, isBlue: false, isRed: true, ranking: 3, createdAt:
'2010-01-20' }, 
{ id: 3, isBlue: false, isRed: true, ranking: 3,
createdAt: '2010-01-23' }, 
{ id: 2, isBlue: false, isRed: true,
ranking: 2, createdAt: '2012-01-23' }, 
{ id: 16, isBlue: false, isRed:
false, ranking: 1, createdAt: '2014-01-23' }, 
{ id: 1, isBlue: true,
isRed: false, ranking: undefined, createdAt: '2014-01-23' },  
{ id: 10,isBlue: true, isRed: false, ranking: 3, createdAt: '2012-01-23'}
 ];
 
 const sorted = rows.sort((a, b) => {
   if( a.isBlue === b.isBlue ) {
     if( a.isRed === b.isRed ) {
       if( a.ranking === b.ranking ) {
         return new Date(a.createdAt) < new Date(b.createdAt) ? -1 : 1;
       }
       return a.ranking < b.ranking ? -1 : 1;
     }
     return b.isRed < a.isRed ? -1 : 1;
   }
   return b.isBlue < a.isBlue ? -1 : 1;
 })
 
 console.log(sorted);
 
 document.write(`ids: ${sorted.map(i => i.id)}`);

Answer 3

Вы можете использовать синтаксис es6 вместо es5, что будет хорошим выбором.

var data = [{
        id: 5,
        isBlue: false,
        isRed: true,
        ranking: 3,
        createdAt: '2010-01-20'
    },
    {
        id: 3,
        isBlue: false,
        isRed: true,
        ranking: 3,
        createdAt: '2010-01-23'
    },
    {
        id: 2,
        isBlue: false,
        isRed: true,
        ranking: 2,
        createdAt: '2012-01-23'
    },
    {
        id: 16,
        isBlue: false,
        isRed: false,
        ranking: 1,
        createdAt: '2014-01-23'
    },
    {
        id: 1,
        isBlue: true,
        isRed: false,
        ranking: null,
        createdAt: '2014-01-23'
    },
    {
        id: 10,
        isBlue: true,
        isRed: false,
        ranking: 3,
        createdAt: '2012-01-23'
    }
];

var obj = {
    isBlue: [],
    isRed: [],
    isNone: []
};
data.forEach(function(val, i) {
    var key = val.isBlue ? "isBlue" : val.isRed ? "isRed" : "isNone";
    obj[key].push(val);
});

function sortValue(a, b) {
    return new Date(a.createdAt).getTime() - new Date(b.createdAt).getTime();
}
obj.isBlue = obj.isBlue.sort(sortValue);
obj.isRed = obj.isRed.sort(sortValue);
obj.isNone = obj.isNone.sort(sortValue);
var result = [].concat(obj.isBlue).concat(obj.isRed).concat(obj.isNone);

console.log(result);