Feedback on JavaScript Calculator

Hello people! I’d like to ask for some feedback on the js calculator I’ve just finished.

I’ve used React and Redux. It has 4 components, the display, the numpad, the operators pad and the presentational one which renders the first three. I’ve used redux to create a store in order to keep track of two states: input and output which are displayed separately in the Display component.

I’d like to know how to reduce the repetition in the reducers code to make my code cleaner, I tried creating functions for cases where both reducers do the same but somehow it doesn’t work. Also, is there anyway to prevent the numbers to overflow the display when the number entered is too high?

Thanks in advance to anyone. Comments and criticism are welcomed.

1 Like

Excellent job on the JavaScript Calculator challenge! I really like the design and colors. Your code also seems to be well written and organized. I can’t comment too much about redux because I’m not a fan. I do have some points though,

  1. test 11 seems to fail ( When the decimal element is clicked, a “.” should append to the currently displayed value; two “.” in one number should not be accepted)

  2. when I input 0.2*0.1 I get 0.020000000000000004 instead of 0.2

  3. I can input 6–6 which shows me an alert saying (Please finish the operation or clear input (AC)) instead of just 6-6. I don’t know if this is purposeful but it doesn’t seem to fail the tests.

  4. When viewed on my mobile the calculator seems to be a little too small for my taste. My sausage fingers keep hitting AC by accident and I have to re-input the equation.

Other than those minor points I think it’s really extremely good!

1 Like

Hey! Thanks a lot for the feedback.

  1. I probably broke something while/after adding keyboard support. I’ll be sure to check it out.

  2. That’s really odd, could it be because in the end I’m using the eval() function?

  3. I’ve added a try and catch before evaluating for incomplete operations such as 6- or 5*, why that’s happening not sure, I’ll be sure to fix it as well.

  4. Great feedback, I have relatively small fingers so I’ll be sure to check out the mobile media queries.

Thanks again mate! Very useful feedback.

I don’t think it’s due to the eval() function. I think it’s due to the level of accuracy. You can play around with Math.round() to get the level of desired accuracy.