LU07.A09 - Basic caluclator with methods

• Work type: Individual
• Means of aid: only teaching materials, no websearch, no use of ai.
• Timeframe: 50 Minutes
• Expected result: A browser based calulator which can sum up 2 digits in the easiest way.

Take the solution of LU06.S08source-code and extend it

In LU06.S08 we were programming a basic calulator by manipulation the values directly when clicking the buttons. This is convenient, but limits the possibilities of the calculator significantly. For example handling the divided-by-zero operation can hardly be handled with events only.

Thus, it is basically a similar assignment, but this time by using methods:

• to set values of diggit1, diggit2 and the operator
• to calulate the result
• to reset all values of the variables

• A01: Copy the solution of LU06.s08 and name it LU07.s09.html
• A02: Make sure to have
  • the assignmen number in <h1> and
  • the description in <h3>-format
• A03: Safe it.

• B01: method setDiggit1(number): It sets the value of the variable diggit1 to the clicked number (diggit-block 1).
• B02: method setDiggit2(number): It sets the value of the variable diggit2 to the clicked number (diggit-block 2).
• B03: method setOperator(op): It sets the value of the variable operator to the clicked operation, e.g +. Hint: further operations are possible.
• B04: method calcResult(op): Performes the calculation correspondigly to the chosen operation, e.g. +.
• B05: method reset(): Sets all variables to the initial values.

• C01: A basic calculation, e.g. 3 + 3 = 6, compraises several variables and their initial values:
  • diggit1: 0
  • operator: '+' (default operation is an addition)
  • diggit2: 0
  • result: 0

• D01: When clicking on the diggit keys of block one the content will be saved in the variable diggit1
• D02: But unlike in the previous task, this time the click triggers a method setDiggit1(dig1)
• D03: Continue with the other three buttons in the same fashion.
• D04: Check the result by displaying the content of the variable diggit1 on the display.

• E01: When clicking the +-button the content will be saved in the variable operator
• E02: Check the result by displaying the content of the variable operator on the screen.
• Hint: The other three basic operations (subtraktion, multiplication, division) are conducted in the same way.

• F01: When clicking on the button in diggit2-block, the content will be saved in the variable diggit2
• F02: But unlike in the previous task, this time the click triggers a method setDiggit2(dig2)
• F03: Continue with the other three buttons in the same fashion.
• F04: Check the result by displaying the content of the variable diggit2 on the display.

• G01: To execute our addition-operation we finally need a button ENTER. This triggers the method caldResult(). As all relevant variable are set by now (diggit1, operator, diggit2) we are ready to finalize our calculation
• G03: Display the result of the variable result on the screen.

Lösung

Volkan Demir