I need to use Math.floor in a JavaScript program to round down the result of a grade calculation, bu-CodePudding

I know the syntax for Math.floor is a number so you can put a number inside of the statement as an argument or have a very equal a number, but in my case I have a grade variable being added to another variable called "total" and then the average of the grades entered equals the total divided by the amount of grades entered.

Here is my code.

var grade = 0;
var avg = 0;
var count = 0;
var total = 0;

do {
    grade = prompt('Enter grade(-1 to stop)');

       
    while (!grade || grade < -1 || grade > 100 || isNaN(grade)) {
      grade = prompt('Enter grade again (-1 to stop)');
    }

        
    if (grade == -1) {
      break
    }

    count  ;

    document.write('<td>Grade '   count   '</td>');
    document.write('<td width="50"> '   grade   ' </td>');
    document.write('</tr>');

    total  = Number(grade); 

  } while (grade != -1)

  document.write('</table>');

  if(count > 0) {
    avg = total / count;
    
  }
  //Math.floor would go here instead of document.write.
  document.write('Semester Average: '   avg   '<br /><br />');

I know you can't use the average variable inside of Math.floor but there has to be another way to have the average rounded dwon if it isn't a whole number.

CodePudding user response：

You can simply use Math.floor (or round) on the var before you write it.

const rounded = Math.round(avg)

CodePudding user response：

Using document.write() is in most cases not a good choice since it causes the document to be left in an unfinished state. Here is my version of the script that will always give you a valid grade overview, even before you have finished collecting all the grades.

function tr(i, g) { // creates and returns a TR DOM element
  const el = document.createElement("tr");
  el.innerHTML = `<td>${i}.</td><td>${g}</td>`;
  return el;
}

const tb = document.querySelector("#mytbl tbody"),
  tf = document.querySelector("#mytbl tfoot th:nth-child(2)"),
  gr = document.querySelector("#grade");
gr.focus();                         // position cursor on input field

document.querySelector("form").addEventListener("submit", function(ev) {
  ev.preventDefault();
  const n = tb.children.length   1; // calculate curent count
  tb.append(tr(n, gr.value));
  gr.value = "";                    // empty the input field again
  tf.textContent = ([...tb.querySelectorAll("td:nth-child(2)")]
    .reduce((a, c) =>  c.textContent   a, 0) / n).toFixed(1) // calculate average and round to 1 digit
});

td, tfoot th:nth-child(2) {text-align:right}

<form><input type="text" id="grade" placeholder="Please enter a grade ..."></form>
<table id="mytbl">
  <thead>
    <tr>
      <th>no.</th>
      <th>grade</th>
    </tr>
  </thead>
  <tbody></tbody>
  <tfoot>
    <tr>
      <th>avg.:</th>
      <th></th>
    </tr>
  </tfoot>
</table>