My Javascript Calculator!

Hey everyone! So I am finished with my JS Calculator (https://codepen.io/Bosa100/pen/oWodrr)! Or at least I think I am. From what I’ve seen while playing around with it, it seems to work just like I want it to. I tried to make it behave the same way the model calculator works, so if anyone notices anything off please let me know. :smiley: Enjoy playing around with it if you wish, and of course if you guys could tell me what you think could be better, etc., I would be extremely grateful. For now I’m probably going to keep it as it is (except for any bugs that I become aware of of course), but I plan to go back and try to make it prettier some time in the future. :smiley:
Thank you all!

One problem I see also occurs in the sample project. Your calculator does not properly honor order of operations; “Please Excuse My Dear Aunt Sally” as I was taught. In other words the precedence for operators should be Parentheses, Exponents, Multiplication, Division, Addition, Subtraction.) For instance 5+6*3 should be interpreted as 5 + (6 * 3) = 23. Your calculator (and the sample project) interprets it as (5 + 6) * 3 = 33.

Also if you press the CE button after an answer it deletes the whole thing not just the last item. In all other cases it does the right thing and deletes the last term only so this behavior is a bit inconsistent.

1 Like

Thanks for pointing this out! I assumed Javascript operations would implement PEMDAS. As to the CE button, I actually meant it to work that way, since that’s how it worked in the sample. It does makes more sense for it to erase the last operation in all cases though. Anyways, I’ll start looking into how to fix the PEMDAS issue.
Thank you so much! :smiley:

@Bosa100

Thanks for pointing this out! I assumed Javascript operations would implement PEMDAS.

They do but you are calculating each section independently instead of the whole sum. What I did in my calculator was to store everything pressed into a string and only calculate the answer by eval’ing that string specifically when the ‘=’ key is pressed.

1 Like

Oh ok. I didn’t even realize there was a way to do calculations with number strings. Wish I had known, Would have saved me plenty of work. xD. Anyways. Thanks for the advice! Also I checked out your Portfolio Page and I really liked it. :+1:

hey man. as you know im a beginner and i won’t pretend to understand the calculator code. one thing i noticed when i went wild was that if i started multiplying and dividing with crazy decimals that i could get the answer to overflow the right hand side of the calculator by a few numbers. for practical purposes i dont think it matters but i figured i’d let you know. other than that im blown away that this site has helped guide you to making something like that. amazing work man.

1 Like

Thanks man! For your kind words and for pointing that out. :smiley: Indeed, this website is quite great. I think the Bonfires (particularly the advanced ones) were the most helpful in terms of this project. They are not required for the Front-End Certificate, but certainly worth the effort. I know at first they might not seem very “real world applicable,” but they really teach you how to handle complex tasks like this one, and you end up learning a whole bunch of useful JS methods as well. Keep up the great work yourself! I’m sure you’ll be at these projects before you know it. :+1:

I have just found a javascript based PEMDAS Calculator Check .

Here is order of operation calculator script check here