Grade Statistics Calculator

Question

I'd like to get some help on my javascript code. I made a grade statistics calculator that shows results on: Min – Max student grade Min – Max student average Min – Max course grade Min – Max course average grade

You can access it live here --> http://jsbin.com/qirefe/edit?html,css,js,output and press the "Show Results" button to see my output. (You can change the names and the grades to get a different output)

My problem is that I cannot figure out why it doesn't show the correct course names on the Min - Max course grade, although it displays the grades right. Also I cannot figure out why it calculates wrongly the min and max course average grade and displays the corresponding courses name wrong..

Any help will be very appreciated :)

The .js code:

var Course0 = Array(6);
var Course1 = Array(6);
var Course2 = Array(6);
var Student = Array(6);

var CMap = [Course0, Course1, Course2];
var NMap = ["Course0", "Course1", "Course2"];

var showResults = function () {

    var Rows = document.getElementsByClassName("srow");

    for (var i = 1; i < Rows.length - 1; i++) {

        var values = Rows[i].getElementsByTagName("input");
        Student[i - 1] = values[0].value;

        for (var j = 1; j < values.length; j++) {
            CMap[j - 1][i - 1] = values[j].value;
        }
    }

    var MinID = MaxID = AvgMinID = AvgMaxID = 0;
    var Min = Max = AvgMin = AvgMax = undefined;

    for (var i = 0; i < Student.length; i++) {

        var c0 = Course0[i];
        var c1 = Course1[i];
        var c2 = Course2[i];

        var lessonMin = Math.min(c0, c1, c2);
        var lessonMax = Math.max(c0, c1, c2);

        if ((lessonMin <= Min) || (typeof Min === "undefined")) {
            MinID = i;
            Min = lessonMin;
        }

        if ((lessonMax >= Max) || (typeof Max === "undefined")) {
            MaxID = i;
            Max = lessonMax;
        }


        var Avg = Math.avg(c0, c1, c2);

        if ((Avg < AvgMin) || (typeof AvgMin === "undefined")) {
            AvgMinID = i;
            AvgMin = Avg;
        }

        if ((Avg > AvgMax) || (typeof AvgMax === "undefined")) {
            AvgMaxID = i;
            AvgMax = Avg;
        }

    }

    var Wrapper = document.getElementById("student-results");
    Wrapper.innerHTML = "";


    Wrapper.innerHTML += "<span>The Student with lower grade is: " + Student[MinID] + ", Equals To " + Min + "</span>";
    Wrapper.innerHTML += "<span>The Student with higher grade is: " + Student[MaxID] + ", Equals To " + Max + "</span>";

    Wrapper.innerHTML += "<hr />";


    Wrapper.innerHTML += "<span>The Student with lower average grade is: " + Student[AvgMinID] + ", Equals To " + AvgMin + "</span>";
    Wrapper.innerHTML += "<span>The Student with higher average grade is: " + Student[AvgMaxID] + ", Equals To " + AvgMax + "</span>";

    var CourseMin = CourseMinID = CourseMax = CourseMaxID = CourseAvgMin = CourseAvgMinID = CourseAvgMax = CourseAvgMaxID = 0;

    CourseMin = CourseMax = CourseAvgMin = CourseAvgMax = undefined;

    for (var i = 0, j = 0; i < Student.length; i++, j += .5) {

        var c0 = Course0;
        var c1 = Course1;
        var c2 = Course2;

        var CheckMin = Math.min(c0[i], c1[i], c2[i]);

        if (CourseMin > CheckMin || (typeof CourseMin === "undefined")) {
            CourseMin = CheckMin;
            CourseMinID = i;
        }

        var CheckMax = Math.max(c0[i], c1[i], c2[i]);

        if (CourseMax < CheckMax || (typeof CourseMax === "undefined")) {
            CourseMax = CheckMax;
            CourseMaxID = parseInt(j);
        }

        var Avg = Math.avg(c0[i], c1[i], c2[i]);

        if (Avg < CourseAvgMin || (typeof CourseAvgMin === "undefined")) {
            CourseAvgMin = Avg;
            CourseAvgMinID = j;
        }

        if (Avg > CourseAvgMax || (typeof CourseAvgMax === "undefined")) {
            CourseAvgMax = Avg;
            CourseAvgMaxID = parseInt(j);
        }

    }

    console.log(CourseMaxID);

    Wrapper.innerHTML += "<hr />";

    Wrapper.innerHTML += "<span>The Course with lower grade have: " + NMap[CourseMinID] + ", Equals To " + CourseMin + "</span>";
    Wrapper.innerHTML += "<span>The Course with higher grade have: " + NMap[CourseMaxID] + ", Equals To " + CourseMax + "</span>";

    Wrapper.innerHTML += "<hr />";


    Wrapper.innerHTML += "<span>The Course with lower average grade have: " + NMap[CourseAvgMinID] + ", Equals To " + CourseAvgMin + "</span>";
    Wrapper.innerHTML += "<span>The Course with higher average grade have: " + NMap[CourseAvgMaxID] + ", Equals To " + CourseAvgMax + "</span>";


    return null;

};

Math.avg = function () {

    var Avg = 0;
    var table = arguments;
    for (var i = 0; i < table.length; i++) {
        Avg += parseFloat(table[i]);
    }
    return parseFloat(Avg / table.length);

};

Answer 1

After examining the output of CourseMaxID and CourseMinID in the console, CourseMinID has an index of 3, but NMap only has 3 values (indexed as 0, 1, 2). So I believe this is why, for example, you are seeing: "The Course with lower grade have: " + NMap[CourseMinID] + ", Equals To " + CourseMin; is undefined -- because the index is out of bounds.

Here's a fix for your issues with CourseMinID and CourseMaxID: Change the definition of CourseMinID to Math.floor(j)-1; And change CourseMaxID to be equal to Math.ceil(j);

Your call to parseInt() on a float value didn't appear to be having the intended consequence.

I'm not entirely sure why you're choosing to increment j by 0.5 each time, but from observation I noticed that for CourseMax/CourseMinID, you wanted to use the computations I noted above.

Another note, for the course average values, you are in fact outputting the student's averages. So you will want to change your logic there. It looks to me like you are giving the horizontal row of grades as parameters to the average function:

var Avg = Math.avg(c0[i], c1[i], c2[i]);

That's not what you want to parse in to Avg for course average grades. I would define another Avg function (let's call it newAvg() here) that takes as input a single array (not multiple arguments), and then call Math.Min/Math.Max on newAvg(c0), newAvg(c1), newAvg(c2).

Here's an updated jsbin link with working functionality for course averages. Overview of changes: newAvg() has been defined to take in and operate on one parameter. Keep track of indices of CourseAvgMax and CourseAvgMin. Note that I've removed some of the other operations you had earlier in this jsbin link to make it easier for me to isolate what I was working on. Hope you find it useful!