Learn Advanced Array Methods by Building a Statistics Calculator - Step 26

JavaScript
1

Tell us what’s happening:

Hello! I am stuck here.
Your getMedian function should return the mean of the middle two numbers if the array length is even.

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <link rel="stylesheet" href="./styles.css" />
    <script src="./script.js"></script>
    <title>Statistics Calculator</title>
  </head>
  <body>
    <h1>Statistics Calculator</h1>
    <p>Enter a list of comma-separated numbers.</p>
    <form onsubmit="calculate(); return false;">
      <label for="numbers">Numbers:</label>
      <input type="text" name="numbers" id="numbers" />
      <button type="submit">Calculate</button>
    </form>
    <div class="results">
      <p>
        The <dfn>mean</dfn> of a list of numbers is the average, calculated by
        taking the sum of all numbers and dividing that by the count of numbers.
      </p>
      <p class="bold">Mean: <span id="mean"></span></p>
      <p>
        The <dfn>median</dfn> of a list of numbers is the number that appears in
        the middle of the list, when sorted from least to greatest.
      </p>
      <p class="bold">Median: <span id="median"></span></p>
      <p>
        The <dfn>mode</dfn> of a list of numbers is the number that appears most
        often in the list.
      </p>
      <p class="bold">Mode: <span id="mode"></span></p>
      <p>
        The <dfn>range</dfn> of a list of numbers is the difference between the
        largest and smallest numbers in the list.
      </p>
      <p class="bold">Range: <span id="range"></span></p>
      <p>
        The <dfn>variance</dfn> of a list of numbers measures how far the values
        are from the mean, on average.
      </p>
      <p class="bold">Variance: <span id="variance"></span></p>
      <p>
        The <dfn>standard deviation</dfn> of a list of numbers is the square
        root of the variance.
      </p>
      <p class="bold">
        Standard Deviation: <span id="standardDeviation"></span>
      </p>
    </div>
  </body>
</html>

/* file: styles.css */
body {
  margin: 0;
  background-color: rgb(27, 27, 50);
  text-align: center;
  color: #fff;
}

button {
  cursor: pointer;
  background-color: rgb(59, 59, 79);
  border: 3px solid white;
  color: white;
}

input {
  background-color: rgb(10, 10, 35);
  color: white;
  border: 1px solid rgb(59, 59, 79);
}

.bold {
  font-weight: bold;
}

/* file: script.js */
const getMean = (array) => array.reduce((acc, el) => acc + el, 0) / array.length;


// User Editable Region

const getMedian = (array) => {
  const sorted = array.sort((a, b) => a - b);
 if (sorted.length % 2 === 1) {
  return getMean(sorted[sorted.length /2] , sorted[(sorted.length / 2) - 1]);
} else {
  return Math.floor(sorted.length / 2) 
}
  

}

// User Editable Region


const calculate = () => {
  const value = document.querySelector("#numbers").value;
  const array = value.split(/,\s*/g);
  const numbers = array.map(el => Number(el)).filter(el => !isNaN(el));
  
  const mean = getMean(numbers);

  document.querySelector("#mean").textContent = mean;
}

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/124.0.0.0 Safari/537.36

Challenge Information:

Learn Advanced Array Methods by Building a Statistics Calculator - Step 26

2

Please talk to us about how the instructions are confusing. Thanks

3

It asked to find the middle two numbers, calculate the mean & return the result. I thought that’s what I was doing but it’s not correct. So I’m confused.

4

You have a couple of issues

First is your if statement here

right now you are checking if the length of the array is odd

if you are going to use that for your condition, then you have to return the correct value.
the directions say if the length of array is odd, return the middle number.

but if you wanted your if statement to check if the lenght of array is even, then you will need to fix your condition here

you should not be checking for a remainder of 1 in this case.
refer back to the lessons on how to check if an array is even.
or you can google it too :+1:

once you fix that issue, then you need to resolve this issue

you are close here

but remember that getMean accepts an array.

here is the function definition again

const getMean = (array) => array.reduce((acc, el) => acc + el, 0) / array.length;

you see how it uses an array for the parameter?
that means when you call the function, it expects an array for the argument.

the last issue is here

your close, but the directions say to return the middle number from that array.
remember that when working with arrays and accessing elements you need to use bracket notation.

the best way to resolve all of your issues is to open a separate tab and review the previous few lessons. It shows examples and you will better see where your mistakes are and you can fix them.

hope that helps

5

Ok I will try that then I will report back. Thank you.

6

I had a hard time but I actually finally solved this one. :face_with_hand_over_mouth: Thanks for you help.