JSFiddle - React, Tailwind, and code Playground

by blesh

JavaScript

/**
 * natural-sort.js
 * (c) 2013 Ben Lesh
 * http://www.benlesh.com
 * MIT License
 */
function naturalSort(arr) {
    var convert = function (x) {
        return isNaN(x) ? x : +x;
    },
    allKeys = arr.map(function (x) {
        var keys = x.split(/(\d+)/).map(convert);
        keys.value = x;
        return keys;
    }),
        maxKeyLen = allKeys.map(function (x) {
            return x.length;
        }).sort()[allKeys.length - 1];

    var i, sortFn;

    for (i = 0; i < maxKeyLen; i++) {
        (function (x) {
            var fn = function (a, b) {
                return a[x] > b[x];
            },
            lastSortFn;
            if (!sortFn) {
                sortFn = fn;
            } else {
                lastSortFn = sortFn;
                sortFn = function (a, b) {
                    return lastSortFn(a, b) || fn(a, b);
                };
            }
        })(i);
    }

    return allKeys.sort(sortFn).map(function (x) {
        return x.value;
    });
}

var testItems = ["z24", "z2", "z15", "z1",
    "z3", "z20", "z5", "z11",
    "z 21", "z22"];

console.log(naturalSort(testItems));