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

Tell us what’s happening:

Hi, I can’t get out of this step. It tells me: “Your function must use a ternary operator”… I don’t understand what’s wrong and even though I searched the forum there isn’t an answer to another question in the same step. Thank you for your time.

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: 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] += 1 : counts[el] = 1);
  return counts;
}

// 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);
  console.log(getMode(numbers));

  document.querySelector("#mean").textContent = mean;
  document.querySelector("#median").textContent = median;
}
/* 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 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/130.0.0.0 Safari/537.36

Challenge Information:

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

This is tricky.

Can you see you are missing the beginning part of the syntax given:

assignment = condition ? exprIfTrue : exprIfFalse

Your sums are right (look at step 34 again to see what sum you need as a reminder). Your condition is right. For your expressions if true / false, there is an equal sign in the assignment syntax at the start so you don’t need to put it in the expressions if true false. Try to think what you need to write before the first equal sign in the syntax and in the 2 expressions if true / false to get the expressions / sums correctly written for each true / false alternative.

1 Like

OOOOkay, so this took me a while. There is a very subtley different approach that they’re looking for. They want the ternary to be the right side of an assignment operation.

So, instead of performing an assignment operation if this or that, choose WHAT operation is to be assigned to counts[el].

Without giving it completely away :
array.forEach(el => counts[el] = (does the value exist in counts) ? (what should be assigned to counts[el] if the value already exists) : (what should be assigned if it doesn't exist);

1 Like

Hi there! I’m trying not to make another redundant post about this, so I thought I’d ask here. I feel like I am close. I understand that the assignment is happening at the beginning (before the condition), and I think I’m hung up on the isTrue part of the statement.

Don’t we need to reference the original counts[el] number if it already exists? So it would be something like counts[el]++ ?

This is what I have and it’s still not working.

array.forEach(el  =>  counts[el]  =  counts[el]  ?  counts[el]++  :  1)

Thank you very much for your help. I don’t speak English and that often causes me problems. When I use the translator, I sometimes miss things. I have already managed to solve the expression.

The expression itself is not wrong, it’s just that there are other ways to increase the value. I went back to step 34 and checked that it accepts this way of increasing, perhaps that’s why you didn’t explore other possibilities.

The hint I have for you is ask yourself what counts[el] ++ actually does. Remember that your truthy condition needs to be just an expression, and not an expression-assignment.

1 Like

Now I have this :sob: array.forEach(el => counts[el] = counts[el] ? counts[el] += 1 : !counts[el === 1;
I am so frustrated

Hi there!

Create your own topic to the challenge step.

In this lesson the expressions should just return a number, not themselves assign values.
array.forEach(el => counts[el] = counts[el] ? counts[el] += 1 : 1);

I fixed the last expression into just 1. No assignment needed in here.

So too the first expression should express just a plain number value.
+= and ++ both assign value directly and is not needed here.

Now fix the first expression so that it only accesses counts[el] and add 1. Don’t use += or ++;

I now have this
array.forEach(el => counts[el] = counts[el] ? counts[el] + 1 : 1)
It won’t pass keeps saying:
Your function should still increment the counts variable properly.

I now have this and it won’t pass

array.forEach(el => counts[el] = counts[el] ? counts[el] + 1 : 1)

keeps telling me
Your function should still increment the counts variable properly.

Must be a test error. I copy pasted the code and it wouldn’t pass and gave the same error message. Then I reset the code and wrote it out by hand and it passed.