StackOverflow_16565875: javascript-sort-an-array-of-arrays-by-the-day-of-the-week.

Illustration of answer to http://stackoverflow.com/questions/16565875/javascript-sort-an-array-of-arrays-by-the-day-of-the-week.

by ExpertSystem

HTML

<div>
    <h3><br />Raw Data</h3>
    <span id="rawData"></span>
</div>
<div>
    <h3><br />Sorted Data</h3>
    <span id="sorted"></span>
</div>
<div>
    <h3>
        Classified by<br />
        Day-of-week
    </h3>
    <span id="classified"></span>
</div>

CSS

div { 
    float: left;
    margin-right: 10px;
}

JavaScript

var raw = "\"['2013-04-15', 26]\", \"['2013-04-16', 10]\", \"['2013-04-17', 51]\", \"['2013-04-18', 46]\", \"['2013-04-19', 32]\", \"['2013-04-20', 50]\", \"['2013-04-21', 26]\", \"['2013-04-22', 31]\", \"['2013-04-23', 48]\", \"['2013-04-24', 821]\", \"['2013-04-25', 917]\", \"['2013-04-26', 949]\", \"['2013-04-27', 405]\", \"['2013-04-28', 593]\", \"['2013-04-29', 925]\", \"['2013-04-30', 877]\", \"['2013-05-01', 277]\", \"['2013-05-02', 112]\", \"['2013-05-03', 115]\", \"['2013-05-04', 62]\", \"['2013-05-05', 74]\", \"['2013-05-06', 76]\", \"['2013-05-07', 51]\", \"['2013-05-08', 93]\", \"['2013-05-09', 231]\", \"['2013-05-10', 350]\", \"['2013-05-11', 258]\", \"['2013-05-12', 0]\", \"['2013-05-13', 61]\"";

var json = raw.replace(/"/g,'');
json = "[" + json + "]";
json = json.replace(/'/g,'"');
var myData = JSON.parse(json);

function sorter(a, b) {
    var d1 = new Date(a[0].replace("-", "/")).getDay();
    var d2 = new Date(b[0].replace("-", "/")).getDay();
    return d1 - d2;
}

function classifyByDayOfWeek(customArr) {
    var byDayOfWeek = [[], [], [], [], [], [], []];
    for (var i = 0; i < customArr.length; i++) {
        var day = new Date(customArr[i][0]).getDay();
        byDayOfWeek[day].push(customArr[i]);
    };
    return byDayOfWeek;
}

function printRaw(arr) {
    str = "";
    for (var i = 0; i < arr.length; i++) {
        str += "[" + arr[i][0] + ", " + arr[i][1] + "]" + "<br />";
    }
    return str;
}
function printClassified(arr) {
    str = "";
    str += "<b>Sundays:</b><br />" + printRaw(arr[0]);
    str += "<b>Mondays:</b><br />" + printRaw(arr[1]);
    str += "<b>Tuedays:</b><br />" + printRaw(arr[2]);
    str += "<b>Wednesdays:</b><br />" + printRaw(arr[3]);
    str += "<b>Thursdays:</b><br />" + printRaw(arr[4]);
    str += "<b>Fridays:</b><br />" + printRaw(arr[5]);
    str += "<b>Saturday:</b><br />" + printRaw(arr[6]);
    return str;
}
    
document.getElementById("rawData").innerHTML = printRaw(myData);...