Упорядочивание массивов, объектов и массивов объектов - CSS-хитрости

Anonim

Массив:

let fruits = (`bananas`, `Apples`, `Oranges`);

Вы можете отсортировать это по алфавиту так же просто, как:

fruits.sort();

Но обратите внимание на непоследовательный регистр в массиве… все символы верхнего регистра будут отсортированы перед символами нижнего регистра (как ни странно), поэтому это будет немного сложнее:

let fruits = (`bananas`, `Apples`, `Oranges`); fruits.sort((a, b) => ( return a.toLowerCase().localeCompare(b.toLowerCase()); )) console.log(fruits); // ("Apples", "bananas", "Oranges")

Массив объектов

Все становится еще сложнее, если то, что вы пытаетесь отсортировать, вложено в объекты. Легко было бы работать с JSON API.

let fruits = ( ( fruit: `Bananas` ), ( fruit: `apples` ), ( fruit: `Oranges` ) );

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

const propComparator = (propName) => (a, b) => a(propName).toLowerCase() == b(propName).toLowerCase() ? 0 : a(propName).toLowerCase() < b(propName).toLowerCase() ? -1 : 1

Итак, теперь мы можем использовать его для сортировки:

fruits.sort(propComparator(`fruit`)); console.log(fruits); /* ( (fruit: "apples"), (fruit: "Bananas"), (fruit: "Oranges") ) */

Просто объект

Если у нас есть просто объект ...

let fruits = ( Bananas: true, apples: false, Oranges: true );

Нам все еще нужно убрать эти ключи, но мы можем отсортировать массив ключей, а затем создать новый объект из этого недавно отсортированного массива ключей.

let sortedFruits = (); Object.keys(fruits).sort((a, b) => ( return a.toLowerCase().localeCompare(b.toLowerCase()); )).forEach(function(key) ( sortedFruits(key) = fruits(key); )); console.log(sortedFruits); /* ( apples: false, Bananas: true, Oranges: true ) */

Массив объектов для сортировки по ключу

let fruits = ( ( Bananas: true ), ( Apples: false ), ( oranges: true ) );

Это, вероятно, самый сложный из них, но выше должно быть достаточно информации, чтобы разобраться. Возьми.

Живой код

См. Раздел «Массивы пера по алфавиту» Криса Койера (@chriscoyier) на CodePen.