# Calculator

Zoom Name:

Video Introduction (11 minutes) <<--- Watch this video first, then

English IDE <<--- Click this link and write your calculator program here. [Q]

When your calculator runs, click the yellow Done button in the IDE to continue.
Then come back here and click this Next link to skip down to the next video.

If it's not a link yet, you might need to refresh your browser, or else click this button to call a mentor:

If you are like me and prefer to read at your own pace instead of whatever pace set in some video, You can read the transcript (and probably come out ahead of the non-readers).

### Video Transcript: 4. Calculator Today we begin a serious program -- not a graphical toy like PBJ, but a real program like people get paid for. YOU will write a 4-function calculator something like this one.

First let's think about exactly what a calculator does. Obviously it calculates, but that's not good enough for the stupid computer, which must be told every tiny little step. When I did this stuff (and got paid for it!) I had to write code for every operation -- even long multiplication and division. Do they teach that stuff in school any more? They did when I went to school, but you-all just buy a \$2 calculator at the Dollar store. Which is OK, both Java and the English computer know how to multiply and divide. The computer hardware knows how to multiply and divide (I was on the committee that set the standard).

But we still need to tell it what steps to do in what order, broken down into the Six Concepts you already know about -- and nothing else. So here they are, to remind us this is what we are aiming for:

Six Concepts
Sequence -- Steps, one by one, in order
Iteration -- A sequence that is repeated more than once
Conditional -- A sequence that is skipped, depending on some test
Variables -- Named values stored in memory, with commands to change the values
Input/Output -- Bringing values in from outside the computer, or sending them out
Subroutines -- A named sequence called up from somewhere else by a single command

Before we can do that, we must understand (in our own heads) exactly what a calculator does when we push the buttons. It turns out to be exactly what we do when we do the same calculation in our heads (or on paper: I do a lot on paper). If you do not want to know how things work, you cannot tell the computer how things work. You cannot tell the computer what is not in your head. Not even the AI people do that.

OK, here's the schoolkid version

2 + 3 = ?
Those four buttons are the buttons you press on the 4-function you get from the Dollar store, and (before Siri) those are the same virtual buttons you touch on the calculator in your iPhone. Then you look at the answer (that's the question mark in the line above, looking at the answer). But that's what you as a user do. What does the computer inside the calculator or smart phone do? That's the part we need to program.

When you press a button, the computer sees it as Input, one of our Six Concepts. Four buttons, four inputs, simple as that.

When you (the user) look at the display, you are looking at Output, ditto.

Done. That's the whole program.

Well, not quite. The computer must decide what to put on the display. Usually the calculator must put something on the display every step of the way, not just the answer. But how do we get there? That's what Top-Down Design (TDD) is all about. We start with the title, what does this program DO? That's the title:

Calculator

Now we want two or three lines describing in general terms how that happens. What's the first thing that happens? We had four of them, remember? That's next. We could start typing it into the program panel of the IDE:

"Calculator"
Four inputs
Display the result

The four inputs we can spell out more particularly. I could make a subroutine here, but as you can see, each of those four inputs is already computer code, so I will just convert the one line into a comment (that means the computer ignores it, it's just there to remind us humans what is happening) by surrounding it with curly braces:

"Calculator"
{Four inputs}
Input first
Input plus
Input second
Input equal
Display the result

Maybe you didn't notice, but those words that follow the "Input" word on each of those four lines? They are variables. That's another of our Six Concepts. If you were to Run this program -- just as it is -- in the IDE, it would stop and wait for you to "Type your input, then Enter" (for the first number), and then again (for the plus), and again two more times (for the second and the equal). Then it doesn't know what to do, maybe it will assume something, or maybe realize it doesn't know and stop, whatever.

OK, let's work on the next line. It isn't actual code yet (as you can see in the Quick Reference at the bottom of the IDE page) so let's make it a comment while we figure out what to do with it.

"Calculator"
{Four inputs}
Input first
Input plus
Input second
Input equal

Display the result

What happens when you add the numbers? Where does the result go? Do you remember the discussion on variables? Does this look like something you saw there? Let's name our variable "result" and you fill in the rest:

"Calculator"
{Four inputs}
Input first
Input plus
Input second
Input equal

Let result = ____
Display the result

Now let's see what the English computer will do with this. Normally you would just be typing this into the program panel all along, so there's nothing left to do but click Run. Well, you still get to type it in. Do you think you can fill out the last line? That would be the red ____. Then click the blue Step button and see if you understand each line, what it does. Notice that the comments, it doesn't do anything there.

Did you leave the last line unchanged? What happened? What did it do?

Even if you understand what is going on, your user (when you show it off to family and friends) will have no idea what to type when it stops for input. Whenever you write a program for Real People to use, you must be careful to tell them what is going on, especially when you want them to do something, like type some input, like this:

"Calculator"
{Four inputs}
Input first
Print "What do you want to do (* - * /)?"
Input plus
Print "Input the number to do it with:"
Input second
Print "Input ="
Input equal
...
Display "The result is " the result

We are not done yet, this calculator only adds. If the user types in a star, it should multiply. Maybe we should change the name of that variable to "operator" to better reflect what the user will be typing there.

If you look at the specification for the Input command (see the link in the Quick Reference at the bottom of the IDE) you can see that there's an optional number following the variable name, which if you specify "1" it accepts a single character and no Enter key is needed, like this:

"Calculator"
{Four inputs}
Input first
Input operator,1
...

Now let's see what we need to change so we can use that input character to decide what operation to do. For that we need a conditional, one of the Six Concepts:

If operator = "+" then
Let result = first+second

What if the user typed in a minus? Or star? You fill in the other three operators (as separate lines).

One more improvement, we have a fourth input line, but the value being input there is not used. Why make the user type in something that isn't going to be used? Later, when we redo this calculator on the Game Engine with real buttons, we will see why all the calculators have an Equal button, but we don't need it today, the Enter at the end of the second number serves that purpose. Take that line out and see if it's better or worse.

Are we finished? Click the yellow Done button in the IDE to tell the rest of us that you are happy with your calculator program.

### Better

Video: Better Calc (6 minutes) <<--- Watch this video next, then

When your calculator runs, click the yellow Done button in the IDE to continue.

If it's not a link yet, you might need to refresh your browser, or else click this button to call a mentor:

If you are like me and prefer to read at your own pace instead of whatever pace set in some video, You can read the next transcript (and probably come out ahead of the non-readers).

### Video Transcript: 4. Better Calculator

What if you are in a restaurant Dutch treat, so you want to add up the charges for each person on the bill? The cashier added up the total, sometimes people just divide it by the number of people, but if one guy orders expensive wine and appetizers, but a single mother on a limited budget drank just water, it wouldn't be fair to make her pay for the other guy's wine and stuff, would it? Or if you are a teacher adding up the total points for a semester of student work, how do you do that on your calculator? Try adding this sum on your new calculator, and see what the problem is:
1 + 2 + 3 + 4 = ?

If you, a person, were trying to do it in your head, you would break it down into bite-sized steps:

1 + 2 = 3
3 + 3 = 6
6 + 4 = 10

Did you see what we did there? We know how to add two numbers, we already told the computer how to do that. So we add the first two numbers, then plug the result of that sum into the first input part of the second addition. Only we don't want to make the user retype that intermediate result, the computer already knows it.

Let's go back to our TDD and add a layer on top:

"Calculator"
First calculation
Three inputs
Do the operation
...
Display the result

What's inside the "Additional calculations" section? It's kind of like the "First calculation" except the first variable value comes from the previous result instead of from an input. So let's reshuffle our design a little to reflect this new insight:

"Any Calculation"
{Two inputs}
Input operator
Input second
{Do the operation}
...
Display the result

"Calculator"
{First calculation}
Input first
Do Any Calculation
Let first = result
Do Any Calculation

I colored in green the parts you need to fill in from your previous version. Fix your calculator program to be like this design, then run it and give it this problem:

1 + 2 + 3 + 4 = ?

Did it work? Why not?

What we really need here is an iteration (another of the Six Concepts) to repeat (added code in blue) the "Additional calculations" part of the program:

Repeat
Let first = result
Do Any Calculation
Next

However this will repeat forever unless we tell it when to stop. A program that gets stuck in an iteration like this is said to "hang" in "an infinite loop." It's very bad form (unless you are writing a control application that needs to run forever), so let's think about when we want the program to end. The user should always be in control, so we can let the user enter a special operator like "Q" for "Quit". This should always be after the user has finished the previous operation, that is, we did the calculation and showed the result, and preferably it should not require any extra attention from the user when they still have more calculation to do.

Use the blue Step button in the IDE to step through your program while doing the following calculation, and see if you can figure out where to put the test for Quit:

2 + 3 = ?

Hint: you will use an existing input. Here is the line that you can put there, after you decide where to put it:

If operator = "Q" then Stop

If you are having trouble, click the Ask button in Zoom, or the Mentor Alert button here (or in the IDE). It is important for you to understand every part of each program you work on.

#### Less

The interesting thing about this program is that you have a subroutine that is called from two different parts of the program, using different values for the first variable. In the English computer all variables are visible everywhere in the program -- which is fine for beginning and small programs like this, but disaster for large programs -- so most languages encourage you to define your variables local to the subroutines, and when they need different values when called from different places (like first in the "Any Calculation" subroutine here) they are set in a special type of local variable called a parameter. You will see how that works when you rewrite this program in Java. Also, one of the callers of this subroutine is using a result variable calculated inside the subroutine; this is again done with a special form of subroutine called a function. We will learn more about functions when you need them in Java.

Do you understand every line in your program? If you don't know what every line does and why, try using the Step button to step through this summation, watching what happens to the variables as you go:

1 + 2 + 3 + 4 = ?

If you are still confused, click the Ask button in Zoom, or the Mentor Alert button here (or in the IDE). It is important for you to understand every part of each program you work on. Otherwise you cannot write your own programs from scratch.

It looks like your program ran correctly. Click this link to advance to the next program: Guessing Game

#### Bonus

Or, if you feel up to the challenge, you might consider that a particularly sharp programmer would observe that the two calls on the "Any Calculation" subroutine are really slight variations on a single iteration, and reduce the whole thing to a single loop with no subroutine calls and no duplicated code. The details I leave as an exercise to the student.

[2022 September 28]