I’m am working on the frontend challenge for libraries. Using React, I am stuck on the following test challenges. Can’t seem to think of a way to approach them. Calculator/handleMath.js at main · CodeSmitty/Calculator · GitHub
I started this a few months ago and kinda gave up on it. But I really want to get it done this time. Looking at other solutions, I know I need regex to test some things but I’m a little burned out atm from fighting with it for days. So I need help getting pushed in the right direction and seperating the problem into small problems.
- In any order, I should be able to add, subtract, multiply and divide a chain of numbers of any length, and when I hit “=”, the correct result should be shown in the element with the id of “display”
- If 2 or more operators are entered consecutively, the operation performed should be the last operator entered (excluding the negative (-) sign.
- When the decimal element is clicked, a “.” should append to the currently displayed value; two “.” in one number should not be accepted
I will list what I did for my project (I am sure there are probably several other ways to go about it and better ones too):
Evaluating on ‘=’
I used math.evaluate() (math.js library) to compute the entire typed string on clicking ‘=’.
You could also check the eval() function (but most of the guides said it had lot of security risks - but will benefit to read up on it).
Multiple consecutive operators
Used regex to check the string of numbers and operators after ‘=’ is clicked, and corrected it accordingly, before evaluating the answer.
One could also store the previous value, keep checking on every click and update the string immediately.
Multiple consecutive decimal points
Used previous value to check if a decimal point was clicked and accordingly decide whether to accept another or not.
It was a difficult project for me and took a lot of time to complete…hope this helps you.
Most of my logic was split in two big chunks. One to handle inputs and one to calculate an expression.
The first has lot of conditional statements to make sure whats pushed in the expression is valid. For example handle the case when a second operator is being selected, or another “
.” when there is already a decimal point in the current number.
The calculate a string expression would split the string into operations and calculate them. This is where the regex was heavily used, as its the best approach to distinguish operators and numbers.
Like you put it, separate the challenge into small problems. Actually separate it into big problems and pick one of them to work on separately, by splitting it into small problems. For example pick the logic on what to do with various user input. Ofc, sooner or later comes the point of having to intertwine each segment together as a whole and you might realize there are small issues you could handle better within another segment. E.g. you can allow the user input “
--” and let your calculate function interpret this as “
+”, or you can directly change minus sign into plus, if the user inputs another minus behind it(which would lessen the labor for your calculate function).
Thank you both, for great advice. I will definitely look into a little different than I was doing. Part of my struggle is once I have an approach translating it to code can be tricky. Like for example in the case of calculating the string weather it’s with math.js or eval. Would I test the regex with the input string on the "= " function?
The part of choosing what is a previous input or number is another one I can’t seem to decide on. Do I add everything to a string everytime I click on a button? Then save the most current inout to a previous input to test on the text click if “.” Condition is met or if “±” or “–” do this instead. If I’m understanding correctly lol. I need more practice at expressing my problems as well. Again thank you both for your time and help, it’s greatly appreciated
This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.