Fixing my maximum and minimum buttons returning NaN in Javascript-CodePudding

My Intro to Coding assignment wants me to create three buttons that calculate the maximum, minimum, and average values for an array. My average button works fine but my maximum and minimum return NaN.

Here's the actual problem for reference.

Create a .js file with the following functions: average, minimum, maximum. All functions will take an array as an input and the calculated value (average, minimum and maximum) as an output. You need to return these values from the functions.
Create a HTML file with one text box and three buttons for Average, Minimum and Maximum. The user will input numbers with spaces in the text box. After the buttons are pressed, you need to show the average/minimum/maximum value in the output div.

<!DOCTYPE html>
<!-- Module 12 Assignment-->

<html lang="en-US">

<head>
    <title> Module 12 Assignment </title>    
</head>

<body>

 <script type="text/javascript" src="array.js"></script>
 <script type ="text/javascript">
 
  function ShowMaxi() {
   var str, strArray, numArray; 
   str = document.getElementById('numsBox').value; 
   strArray = str.split(/[ ,] /); 
   numArray = ParseArray(strArray); 

   document.getElementById('outputDiv').innerHTML = 
     'The Maximum of ['   numArray   '] is '   Math.max(numArray);
  }
    
  function ShowMini() {
   var str, strArray, numArray; 
   str = document.getElementById('numsBox').value; 
   strArray = str.split(/[ ,] /); 
   numArray = ParseArray(strArray); 

   document.getElementById('outputDiv').innerHTML = 
     'The Minimum of ['   numArray   '] is '   Math.min(strArray);
  }

  function ShowAvg() {
   var str, strArray, numArray; 
   str = document.getElementById('numsBox').value; 
   strArray = str.split(/[ ,] /); 
   numArray = ParseArray(strArray); 

   document.getElementById('outputDiv').innerHTML = 
     'The Average of ['   numArray   '] is '   Average(numArray);
  }
        
      </script>
  
   <body>
     <p> 
     Enter numbers: <input type = "text" id = "numsBox" size = 35 value = ""> 
     </p>
     <p> 
       <input type = "button" value = "Calculate Minimum" onclick="ShowMini()"> 
       <input type = "button" value = "Calculate Maximum" onclick="ShowMaxi()">
       <input type = "button" value = "Calculate Average" onclick="ShowAvg()"></p>
   </body>
  <div id="outputDiv"></div>
</html>

// arrays.js            Dave Reed
// Functions for manipulating arrays of values
/////////////////////////////////////////////////////////

function Acronym(phrase) 
// Assumes: phrase is a string of words, separated by whitespace 
// Returns: the acronym made up of first letters from the words 
{
  var words, acronym, index, nextWord;

  words = phrase.split(/[ \t\n] /);         // CONVERT phrase TO AN ARRAY 
  acronym = '';                             // INITIALIZE THE acronym

  index = 0;                                // START AT FIRST WORD 
  while (index < words.length) {            // AS LONG AS WORDS LEFT 
    nextWord = words[index];                //     GET NEXT WORD
    acronym = acronym   nextWord.charAt(0); //   ADD FIRST CHAR OF WORD 
    index = index   1;                      //   GO ON TO NEXT WORD 
  }
  return acronym.toUpperCase();             // RETURN UPPER CASE acronym
}


function ParseArray(strArray) 
// Assumes: strArray is an array of strings representing numbers 
// Returns: a copy of strArray with items converted to numbers 
{
  var numArray, index; 
  
  numArray = [ ];                       // CREATE EMPTY ARRAY TO STORE COPY

  index = 0;                            // FOR EACH ITEM IN strArray
  while (index < strArray.length) {     //   CONVERT TO NUMBER AND COPY
    numArray[index] = parseFloat(strArray[index]);
    index = index   1; 
  }
  return numArray;                      // FINALLY, RETURN THE COPY
}


function Average(numArray)
// Assumes: numArray is an array of numbers
// Returns: average of the numbers in numArray
{
  var sum, index;
 
  sum = 0;                             // INITIALIZE sum
 
  index = 0;                           // START AT FIRST NUMBER
  while (index < numArray.length) {    // AS LONG AS NUMBERS LEFT
    sum = sum   numArray[index];        //   ADD NUMBER TO sum
    index = index   1;                 //   GO ON TO NEXT NUMBER
  }
  return sum/numArray.length;          // RETURN AVERAGE
}

CodePudding user response：

In JavaScript, the Math.max and Math.min functions do not take Arrays as parameters. Instead, they take multiple integers as parameters, for example: Math.max(1, 3, 4) would return 4. To convert an Array into individual parameters, use the ... operator: Math.max(...numArray). Additionally, I see that you are using strArray instead of numArray as the input to Math.min in the ShowMini function.

CodePudding user response：

In showmaxi you have

document.getElementById('outputDiv').innerHTML = 
     'The Maximum of ['   numArray   '] is '   Math.max(numArray);

You need to use the ... operation to pull the numbers out of the array

document.getElementById('outputDiv').innerHTML = 
     'The Maximum of ['   numArray   '] is '   Math.max(...numArray);

You have the same issue with showmini

CodePudding user response：

In JavaScript, the Math.max and Math.min functions do not take Arrays as parameters. Instead, they take multiple integers as parameters, for example: Math.max(1, 3, 4) would return 4. To convert an Array into individual parameters, use the ... operator: Math.max(...numArray). Additionally, I see that you are using strArray instead of numArray as the input to Math.min in the ShowMini function.