An array:
let fruits = [`bananas`, `Apples`, `Oranges`];
You can sort of alphabetize that as easy as:
fruits.sort();
But notice the inconsistent casing in the array... uppercase characters will all be sorted before lowercase characters (weirdly enough) so it'll be a little more complicated:
let fruits = [`bananas`, `Apples`, `Oranges`];
fruits.sort((a, b) => {
return a.toLowerCase().localeCompare(b.toLowerCase());
})
console.log(fruits);
// ["Apples", "bananas", "Oranges"]
Array of Objects
Things get trickier still if what you are trying to sort is nested within objects. Easily could be the case working with a JSON API.
let fruits = [
{
fruit: `Bananas`
},
{
fruit: `apples`
},
{
fruit: `Oranges`
}
];
We could make a custom sorting function for this, but one slight step further is to make a more generic function that takes the key to sort by as a param.
const propComparator = (propName) =>
(a, b) => a[propName].toLowerCase() == b[propName].toLowerCase() ? 0 : a[propName].toLowerCase() < b[propName].toLowerCase() ? -1 : 1
So now we can use it to sort:
fruits.sort(propComparator(`fruit`));
console.log(fruits);
/*
[
{fruit: "apples"},
{fruit: "Bananas"},
{fruit: "Oranges"}
]
*/
Just an Object
If we just have an object...
let fruits = {
Bananas: true,
apples: false,
Oranges: true
};
We still need to downcase those keys, but we can sort an array of the keys and then make a new object from that newly sorted array of keys.
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
}
*/
Array of Objects to sort on Key
let fruits = [
{
Bananas: true
},
{
Apples: false
},
{
oranges: true
}
];
This is probably the trickiest of them all, but there should be enough information above to sort it out. Get it.
Live Code
See the Pen Alphabetizing Arrays by Chris Coyier (@chriscoyier) on CodePen.