How to sort by Numbers first then Alphabetical

Question

I'm trying to sort an array:

["B3", "D2", "F1", "A9", "D12", "A2", "C1", "Z0", "B1"]

The expected output should be:

["Z0", "B1", "C1", "F1", "A2", "D2", "B3", "A9", "D12"]

Here's my code:

let array = ["B3", "D2", "F1", "A9", "D12", "A2", "C1", "Z0", "B1"];
let collator = new Intl.Collator(undefined, {
  numeric: true,
  sensitivity: "base",
});
console.log(array.sort(collator.compare));

The output is then sorted by Alphabet first, which gives:

["A2", "A9", "B1", "B3", "C1", "D2", "D12", "F1", "Z0"]

So I figured out that if I switch the position of ever value like this:

["3B", "2D", "1F", "9A", "12D", "2A", "1C", "0Z", "1B"]

And then pass it in collator again, it'll give me the correct sorted sequence, but just that the number and letters are flipped. I'll then have to flip them back. Is there a better way of doing this?

Answer 1

If you have always a single letter, you could sort by the numerical rest and by the first letter.

const
    array = ["B3", "D2", "F1", "A9", "D12", "A2", "C1", "Z0", "B1"];

array.sort((a, b) => a.slice(1) - b.slice(1) || a[0].localeCompare(b[0]));

console.log(...array);

If you have more than one letter, you could take a regular expression and get only digits and non digits, separated into an object.

const
    getValues = string => ({
        letters: string.match(/\D+/)[0],
        digits: string.match(/\d+/)[0]
    }),
    array = ["B3", "D2", "F1", "A9", "D12", "A2", "C1", "Z0", "B1"];

array.sort((a, b) => {
    const [aa, bb] = [a, b].map(getValues);

    return aa.digits - bb.digits
        || aa.letters.localeCompare(bb.letters);
});

console.log(...array);