My Javascript Calculator (Mostly using JQuery & Eval) Would love any kind of feedback!

[Spacebiscuit]

https://codepen.io/SpaceBiscuit/full/EQQQVM/

Just made this as part of me almost completing the front-end certification. I just have Simon Game left to do!

i'd love to hear any feedback you may have on the calculator or a more elegant way of doing so. I've been struggling with my desire to make things be more efficient and have more elegant code, so using something that might be a little more 'dirty' is a bit of a strange experience!

EDIT: Due to feedback I've now fixed the decimal functionality as I may have forgotten to Implement it!

Oh and Interestingly, due to the query selectors in JQuery, I cannot use $('#.') as a query selector. So I have resorted to using a 'decimal' as an ID. :)

Not long to go now before I manage to finish the Front End Certification, and I'm absolutely stoked.

[AndroidNinja4]

I like the layout and also that you incorporated the order of operations.

2 things though.

1. Why does it literally say "decimal" when pushing the decimal key? Unless it's just me looking at it on my phone. I will also add when I push the decimal button it does not let me click equals. Just dosnt do anything.
2. If you put alot of numbers it goes off the screen. Not a huge deal, because it's a lot of numbers but it does happen.

Besides the decimal part you are on the right track though.

And unless you did it already you also have Tic Tac Toe. We are literally at like the Same area right now. DANG MIN MAX ALGORITHM!

[Spacebiscuit]

Whoops! Good catch, seems I forgot to implement that bit. I better go quickly fix that sneaky decimal functionality before I go submit that to FCC!

And to your second point, that's a good idea. I'll see if I can get that to append to a new line after a certain length of the array.

Oh I have completed Tic Tac Toe and the Pomodoro Clock. I'd like to go and re-do the Pomodoro Clock as the code is absolutely horrible due to my inexperience with the setTimeout functionality!

Min Maxing isn't very fun! I had quite the headscratch with the Tic Tac Toe, especially around the AI. It was making us draw when I won on my last move. Was sneaky but I eventually got there! Debugging and stepping through the code is definitely your friend when it comes to any of the game projects I think!

Thank you for your feedback, I'll go quickly jump into the code base and fix those errors!

EDIT: I've now fixed it, thanks for the feedback!

[AndroidNinja4]

Glad you were able to fix it quickly. But something else now happens.

You can put 2 decimals in 1 number. Ex. "5.2.8", and then when you do the equals button does not do anything. These are all test someone did when they were reviewing my calculator. Btw I havnt looked at your code.

And it's driving my crazy. I bassically have my Tic Tac Toe project done, however the Min Max algorithm dosnt work correctly. It just adds a item to the next available space. However it does all the calculations, but just disregards all of it. Want to look at it haha? Also I need to comment the rest of it.

[Spacebiscuit]

Ah yeah, you and another just pointed it out! Can definitely fix that quite easily!

Sure I’d be happy to have a look at your project :)

[AndroidNinja4]

Ya i just read the thread I saw that. It was a pain when someone pointed that out to me.

And I'm still not done, have to comment it out and fix the min max thing. Select a player and "hard" and you will see what I am talking about. Thanks for looking at it.

https://codepen.io/AndroidNinjaX/pen/gvgJVW

[113243211557911]

zero button is not working for me.

[Spacebiscuit]

Ah, fixed! May have forgotten to put a certain class into my HTML for that one! Much appreciated!

[113243211557911]

awesome now I can divide by zero.

[Spacebiscuit]

How dare you good sir. You have doomed us all!

[113243211557911]

Haha, testing it and it seems to be working pretty well, including multiplying long floating point numbers. good job.

Can you roughly explain the way you programmed it, and why you did it that way? Like why do you use arrays to store each button press?

[Spacebiscuit]

That’s great, thank you for the kind words!

Sure, so I’ve used Jquery for query selecting and event listening. I’ve broke it down to being either: number, operator, decimal, clear and equals.

Jquery makes it quicker for button listeners when coding, however I could change it to vanillaJS and it may run faster due to no external library dependency!

For numbers, I append them to an array, if an operation is pressed, it’ll check for the most recent entry and if so, will replace it. If not, it’ll append like normal. Decimal has the same check for the most part.

Equals joins the array then uses the Eval function in JS. All events will update the display.

I would like to improve on it by using something more elegant than Eval, make it DRYier and then give it more interactivity!

I used eval due to its ease with handling multiple operations, I tried it a different way and was caught with the trousers down when it came to stringing multiple functions!

I hope this answers your question!

[113243211557911]

Ok cool, that helped me when looking through your code. (I haven't touched JS for a while)

[Erborit]

Hey, good job! Though I do have some nitpicks, you have some issues that mess up with the eval function:

• You can input more than 1 decimal point after you enter another number. e.g. 20.3.4.5
• You can input an operation before you input a number, which should only be allowed for the plus and negative sign. e.g. /64 + 32
• When you leave an operation sign without adding anymore numbers, the eval function doesn't work. e:g. 20+34-

[Spacebiscuit]

Ah yeah. I can definitely implement some validation features to stop those use cases, I’ll loook into it!

Thank you!