Learn Functional Programming by Building a Spreadsheet - Step 36

Tell us what’s happening:

Describe your issue in detail here.

Hi Campers!

I think my problem is that the second character class within the second character class is not optional. I’ve tried variations. Can’t seem to resolve.

Please help!
Than you!

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" />
    <title>Functional Programming Spreadsheet</title>
  </head>
  <body>
    <div id="container">
      <div></div>
    </div>
    <script src="./script.js"></script>
  </body>
</html>
/* file: styles.css */
#container {
  display: grid;
  grid-template-columns: 50px repeat(10, 200px);
  grid-template-rows: repeat(11, 30px);
}

.label {
  background-color: lightgray;
  text-align: center;
  vertical-align: middle;
  line-height: 30px;
}
/* file: script.js */
const isEven = num => num % 2 === 0;
const sum = nums => nums.reduce((acc, el) => acc + el, 0);
const average = nums => sum(nums) / nums.length;

const median = nums => {
  const sorted = nums.slice().sort((a, b) => a - b);
  const length = sorted.length;
  const middle = length / 2 - 1;
  return isEven(length)
    ? average([sorted[middle], sorted[middle + 1]])
    : sorted[Math.ceil(middle)];
}

const spreadsheetFunctions = {
  sum,
  average,
  median
}

const range = (start, end) => Array(end - start + 1).fill(start).map((element, index) => element + index);
const charRange = (start, end) => range(start.charCodeAt(0), end.charCodeAt(0)).map(code => String.fromCharCode(code));


// User Editable Region

const evalFormula = (x, cells) => {
  const idToText = id => cells.find(cell => cell.id === id).value;
  const rangeRegex = /([A-J])([1-9]:[0-9])/
}

// User Editable Region


window.onload = () => {
  const container = document.getElementById("container");
  const createLabel = (name) => {
    const label = document.createElement("div");
    label.className = "label";
    label.textContent = name;
    container.appendChild(label);
  }
  const letters = charRange("A", "J");
  letters.forEach(createLabel);
  range(1, 99).forEach(number => {
    createLabel(number);
    letters.forEach(letter => {
      const input = document.createElement("input");
      input.type = "text";
      input.id = letter + number;
      input.ariaLabel = letter + number;
      input.onchange = update;
      container.appendChild(input);
    })
  })
}

const update = event => {
  const element = event.target;
  const value = element.value.replace(/\s/g, "");
  if (!value.includes(element.id) && value.startsWith('=')) {

  }
}

Your browser information:

User Agent is: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36

Challenge Information:

Learn Functional Programming by Building a Spreadsheet - Step 36

You appear to have created this post without editing the template. Please edit your post to Tell us what’s happening in your own words.

Hi Campers!

I think my problem is that the second character class within the second character class is not optional. I’ve tried variations. Can’t seem to resolve.

const rangeRegex = /([A-J])([1-9]:[0-9])/

}

Please help!
Than you!

I think you’re skipping ahead a bit, read the requirements again (Hint: Did not ask for a colon to be captured.)

Highly recommend this website to test your regex and learn about it:
https://regex101.com/

1 Like

Thank you! You are absolutely right! Thank you also for the link! Its saved as a resource!

please how did you go about it, I have tried and can’t seem to get past it

Hi @omarnate10,

The instructions are:

“Start by declaring a rangeRegex variable and assign it a regular expression that matches A through J (the range of columns in your spreadsheet). Use a capture group with a character class to achieve this.”

If you see @pkdvalis’s tip to me, I have tried to do more than what was required, and not correctly so:

“I think you’re skipping ahead a bit, read the requirements again (Hint: Did not ask for a colon to be captured.) Highly recommend this website to test your regex and learn about it: https://regex101.com/

While my code could work with a minor tweak, it is not what is expected. Try again. Keep it simple. You only need to worry about using a regular expression to match A through J. Remember, regular expressions are used for pattern recognition, by defining the matching criteria.

I’d love to give you the full working solution, but if you find that for yourself, the reward would be more!

Happy coding!

1 Like

let me try and keep it simple, if I don’t get it, I would like to see your solution.

thanks for the swift reply.

Can anyone help? I’ve already tried several expressions and they didn’t work:

/([A-J])\d+/g
/([A-J]\d+:[A-J]\d+|[A-J]\d+)/g
/([A-J]\d+:[A-J]\d+)|([A-J]\d+)/g

I got it with the code:

/([A-J])/g

/([A-J])/g this finally worked, guess the instructions are quite confusing.