# Simple JavaScript Calculator

In this article I describe the development of my very simple JavaScript calculator page. I created the calculator page because I wanted to use the keyboard to enter the numbers and operators, and see the trail of these that I had entered before submitting them for an answer. I couldn't find a similar built-in facility for Windows (i.e. one that I wouldn't have to download and install). MS Calculator doesn't let you see the trail of numbers and operators - and although Linux has bc (which I really like), I only get to use it when I have an SSH session going with the Linux server at work. Putting my script on a web page means I can use it on any computer with a web browser and an internet connection.

I sat down to write the calculator code thinking about stacks and pushing and popping numbers and operators on and off them, something I came across in a programming book. This was gonna take some time, I thought; but in the end I used a much simpler method and the calculator was written very quickly.

In fact, most of the work for the calculator is done by JavaScript itself. JavaScript (like a lot of other programming languages) can have statements that resemble simple mathematical expressions, such as "1 + 2", which unsurprisingly evaluates to 3. I realized that if I could get JavaScript to evaluate such an expression for me, I wouldn't have to write the code to do so myself. The JavaScript function `eval()` does just that.

However, as users can enter anything they like in a text field, I had to be sure that what was passed to `eval()` was at least restricted to the characters one might use in simple arithmetic. This is achieved by comparing the input to a regular expression requiring that only certain characters be present in the string. The characters accepted are:

• 0-9
• .
• +, -, *, /
• (, )
• [space]

Even if the characters supplied are valid, the user can still enter a non-sensical expression such as ")(", which would generate an error when passed to `eval()`. The solution here was to wrap the call to `eval()` in a try-catch statement. JavaScript attempts to evaluate the string passed to `eval()`, and if it encounters an error, such as a syntax error, an exception is generated and dealt with in the catch clause.

I decided that any input deemed invalid would cause my function to return the string "err", which is suitable for the purposes of my calculator page. It might be a better idea to return something else, perhaps NULL, if the function were to be used as a general purpose calculator. Note that passing an empty string to `eval()` returns "undefined" - I had my function return zero instead. Here is the basic function behind the calculator page (with some variables renamed and more commenting):

```// Evaluates the expression passed and returns the answer.
// If the input is in some way invalid, returns 'err'.
// If the input is empty, returns zero.
function calculate(expression)
{

// expression must match the regular expression
if (expression.match(/^[0-9+\-*/(). ]*\$/))
{
try
{
// eval() attempts to evaluate expression
// If expression is empty, assign zero to answer
answer = expression != '' ? eval(expression) : '0';
}
catch (e)
{
// Syntax error - Do nothing... answer remains 'err'
}
}