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

**URL:** <https://forum.freecodecamp.org/t/learn-advanced-array-methods-by-building-a-statistics-calculator-step-35/685170>\
**Category:** Curriculum Help\
**Tags:** javascript\
**Created:** [April 13, 2024, 4:03am UTC](https://forum.freecodecamp.org/t/learn-advanced-array-methods-by-building-a-statistics-calculator-step-35/685170 "2024-04-13T04:03:15Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![davidgar026](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/davidgar026/32/359979_2.png) [@davidgar026](https://forum.freecodecamp.org/u/davidgar026)\
**Post date:** [April 13, 2024, 4:03am UTC](https://forum.freecodecamp.org/t/learn-advanced-array-methods-by-building-a-statistics-calculator-step-35/685170/1 "2024-04-13T04:03:15Z")

</div>

### Tell us what’s happening:

From my understanding, if I return a a-b in a sort’s callback function. it will return in an ascending order. If I return b-a, then it’ll return a descending order. It didn’t do that for my case.

I did what the instructions say which is to return a counts[b] - counts[a] and access the first element of the array which is highest[0].

Let me know what I’m doing wrong and how I can improve upon it.

### 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>

```

```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;
}

```

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

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

// User Editable Region

const getMode = (array) => {
  const counts = {};
  array.forEach((el) => {
    counts[el] = (counts[el] || 0) + 1;
  })
  if (new Set(Object.values(counts)).size === 1) {
    return null;
  }
  const highest = Object.keys(counts).sort((a,b) => (counts[b] - counts[a])
    //counts[a] - counts[b]
  );
  return highest[0];
}

console.log(getMode([1,4,2,4,5,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);
  const median = getMedian(numbers);

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

```

### Your browser information:

User Agent is: `Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/123.0.0.0 Safari/537.36`

### Challenge Information:

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

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

---

<div class="post-metadata">

**Author:** ![bbsmooth](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/bbsmooth/32/203556_2.png) [@bbsmooth](https://forum.freecodecamp.org/u/bbsmooth)\
**Post date:** [April 13, 2024, 6:16am UTC](https://forum.freecodecamp.org/t/learn-advanced-array-methods-by-building-a-statistics-calculator-step-35/685170/2 "2024-04-13T06:16:23Z")

</div>

> [@davidgar026](#):
>
> `return highest[0];`

The instructions aren’t asking you to return anything from the function, so get rid of this line completely.

Do you really have the comment in the callback function? The tests won’t like that. Get rid of it. Everything you add should be on one line.

“Finally, access the first element in the array using bracket notation to complete your `highest` variable.”

This needs to be on the same line as everything else you add. After the right side of the equals executes, the variable `highest` should should contain the first element in the sorted array.

---

<div class="post-metadata">

**Author:** ![davidgar026](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/davidgar026/32/359979_2.png) [@davidgar026](https://forum.freecodecamp.org/u/davidgar026)\
**Post date:** [April 14, 2024, 1:15am UTC](https://forum.freecodecamp.org/t/learn-advanced-array-methods-by-building-a-statistics-calculator-step-35/685170/3 "2024-04-14T01:15:33Z")

</div>

Thank you! I was able to solve it. I really thought that I had to return something because I wasn’t sure what -

“Finally, access the first element in the array using bracket notation to complete your `highest` variable.”

meant.

---

<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:** [October 13, 2024, 1:15pm UTC](https://forum.freecodecamp.org/t/learn-advanced-array-methods-by-building-a-statistics-calculator-step-35/685170/4 "2024-10-13T13:15:43Z")

</div>

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