Help out a noob in Front End Development Building a Calculator

JavaScript
1

Hey folks!
I am new to coding, I have been slowly picking away at FCC, but other than that, total noob. I’m working on building a calculator for the Front End Development Libraries Projects.

I’ve taken a few wacks at it and I have had trouble with multiplying decimals.
additionally I can’t seem to find the issue in why my input won’t show up in the display now. If you see something else, let me know.

Any help at all is appreciated.
Cheers,
Stephanie

2

You’ve got some syntax errors which are preventing your JS from running propery. You can use codepen’s JS analyzer to help you find them. I’ll get you started:

numberKey.forEach(button) => {
  button.addEventListener('click', () => {
    calculator.appendNumber(button.innerText)
    calculator.updateDisplay()
  })
})

You should always have the same number of opening and closing parens. You’ve got an extra closing paren in there.

3

Thanks a bunch!
I have passed all but one test. User story #13.

13. If 2 or more operators are entered consecutively, the operation performed should be the last operator entered (excluding the negative (-) sign.

I have tried multiple approaches and I feels stuck.

4

I just ran the tests on your codepen and it is only showing 11/16 passing. Have you saved all of your recent changes?

5

Try again, I have saved changes.

6

Well, that’s worse :frowning_face: Now only 7/16 are passing.

7

Odd. I’ve been working on it the last 30 min, so I’ll stop messing around while you’re trying it. On my end it says 15/16 as of now.

8

My problem is when computing 5 + * 7 = 12 . it should solve to 35.
I should be able to click multiple operators and it only use the last operator pressed.
This is my code so far for the Operator buttons. I’m not sure where I’m going wrong.

operationButtons.forEach(button => { button.addEventListener('click', () => { calculator.chooseOperation(button.innerText); if(!(calculator.current == '' && button.innerText == "-")); if(!(calculator.current == '+*/' && calculator.previous == '+*/')){calculator.replace(previous, current)}; {calculator.updateDisplay()} }) })

9

Sorry, I’m still only getting 7/16 passed in your codepen and numerous JS errors in the console, so I can’t even test that formula in your calculator. Did you perhaps start a new one and have a different URL?

10
11

Sorry, still getting JS errors and only 7/16 passed. Maybe it’s just me?

13

The link should work now. I’m still having trouble with story #13

14

OK, I am now getting 15/16 on the test :slight_smile:

Also, you have a typo on line 142. I think you left out the first n in patternForNumbers.

As for 13, the formula the test is using is 5 * - + 5. Where in your code are you handling the case where the user inputs a multiplication sign, then a minus sign, and then a plus sign?

15

I have been trying to work it in at line 30, in chooseOperation(operartion). If there are multiple operations chosen, use the last operator.
I have also tried at line 121; It is currently a note. To replace operation when there is already an operator.

16

In the chooseOperation function I would add a console log at the beginning and look at both the operation passed in and the value of this.currentOper. And then try 5 * - + 5. Are these values what you expected them to be?

Also, what are the possible values of this.currentOper? Because you have

if (
      this.currentOper === "/[+*/]/" &&
      this.currentOper.includes("/[+*/]/")
    ) {

Is the string /[+*/]/ really a potential value of this.currentOper?

17

After the first operation is clicked, it shows in the console. When I click more operationButtons, they show an empty string in the console.
I have tried various if statements, replace(), slice() and various potential values of this.currentOper in operationButtons , updateDisplay, and chooseOperation.
I know I need it to change the operator when I click operationButtons and before it gets to the this.compute step in chooseOperation. I just am not sure how to go about that.

18

I have tried to add an addEventListener('change' , ()=> to update the operation each time an operationButton is clicked, but it still won’t update the first clicked operation.

operationButtons.forEach(button => { button.addEventListener('change', () => { calculator.chooseOperation(button.innerText); calculator.updateDisplay(); }) })

19

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