# Learn Advanced Array Methods by Building a Statistics Calculator - Step 27

**URL:** <https://forum.freecodecamp.org/t/learn-advanced-array-methods-by-building-a-statistics-calculator-step-27/714316>\
**Category:** Curriculum Help\
**Tags:** javascript\
**Created:** [October 1, 2024, 4:31pm UTC](https://forum.freecodecamp.org/t/learn-advanced-array-methods-by-building-a-statistics-calculator-step-27/714316 "2024-10-01T16:31:03Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![romane123](https://avatars.discourse-cdn.com/v4/letter/r/c6cbf5/32.png) [@romane123](https://forum.freecodecamp.org/u/romane123)\
**Post date:** [October 1, 2024, 4:31pm UTC](https://forum.freecodecamp.org/t/learn-advanced-array-methods-by-building-a-statistics-calculator-step-27/714316/1 "2024-10-01T16:31:03Z")

</div>

### Tell us what’s happening:

Hello guys,  
I’ve been messing around with this challenge and I just don’t get why isn’t it working. Could someone please explain to me what is wrong? Thank you!

### Your code so far

```html
<!-- 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>

```

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

// User Editable Region

const getMedian = (array) => {
  const sorted = array.toSorted((a, b) => a - b);
  if (sorted.length % 2 === 0) {
    return getMean(sorted[sorted.length / 2], sorted[sorted.length / 2 - 1]);
  }
  else {
   return sorted[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;
}

```

```css
/* 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;
}

```

### Your browser information:

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

### Challenge Information:

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

> **[freeCodeCamp.org](https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures-v8/learn-advanced-array-methods-by-building-a-statistics-calculator/step-27)**
>
> Learn to Code — For Free

---

<div class="post-metadata">

**Author:** ![Teller](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/teller/32/412338_2.png) [@Teller](https://forum.freecodecamp.org/u/Teller)\
**Post date:** [October 1, 2024, 6:58pm UTC](https://forum.freecodecamp.org/t/learn-advanced-array-methods-by-building-a-statistics-calculator-step-27/714316/2 "2024-10-01T18:58:23Z")

</div>

Hi @romane123

Here is a [post](https://forum.freecodecamp.org/t/learn-advanced-array-methods-by-building-a-statistics-calculator-step-22/661976) you may find helpful.

Happy coding

---

<div class="post-metadata">

**Author:** ![t.princess1032](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/t.princess1032/32/371162_2.png) [@t.princess1032](https://forum.freecodecamp.org/u/t.princess1032)\
**Post date:** [October 21, 2024, 2:17pm UTC](https://forum.freecodecamp.org/t/learn-advanced-array-methods-by-building-a-statistics-calculator-step-27/714316/3 "2024-10-21T14:17:37Z")

</div>

you are done actually, you are just missing 2 square brackets check closely from the example given.

---

<div class="post-metadata">

**Author:** ![system](https://global.discourse-cdn.com/freecodecamp/original/3X/e/1/e1c433102e34b46dfaa3e15d13ab9a514b127078.svg) [@system](https://forum.freecodecamp.org/u/system)\
**Post date:** [April 22, 2025, 2:17am UTC](https://forum.freecodecamp.org/t/learn-advanced-array-methods-by-building-a-statistics-calculator-step-27/714316/4 "2025-04-22T02:17:39Z")

</div>

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.
