10 Parameters Mark Dixon SOFT 131 Page 1

Session Aims & Objectives • Aims – To introduce passing parameters/arguments to procedures to

Example: Clock (analysis) SPECIFICATION • User Requirements – to know what the time is

Example: Clock (user interface) • 14 objects: – 12 numbers – mid point –

Example: Clock v 0 (HTML) <html> <head><title></head> <body> <div id=div 1 style="position: absolute; ">1</div>

Example: Clock v 1 (HTML) • Remove 'hard coded' tags <html> <head><title></head> <body> <img

Example: Clock v 1 (code) Option Explicit • use loop to put in tags

Example: Clock v 1 (code) Option Explicit Sub window_On. Load() Dim ang Dim s

Example: Clock v 1 (code) Option Explicit • same 2 lines duplicated Sub window_On.

Problem: Inflexible Procedure • Procedure does exactly the same each time Sub Show. Hands()

Parameters/Arguments (what) • Sometimes procedures need information – Making a cup of tea: •

Parameters (how) • Procedure Declaration – Formal parameters define name Option Explicit Dim res

Parameters (how) Mark Dixon SOFT 131 Page 14

Questions: Parameters Given the following declaration: Sub thing(Num 1, Num 2, Num 3) Dim

Example: Clock v 2 (code) Option Explicit Sub window_On. Load() Dim ang Dim s

Comparison of Clock Code v 0 (64 lines) (2474 bytes) <html> <head><title></head> <body> <div

Example: Clock v 3 For i = 1 To 12 Position document. body. children("div"

Memory Addresses • Memory addresses - keep track of where variables are stored in

Example: Change the Value Mark Dixon SOFT 131 Page 20

Parameter Passing Methods • 2 ways to pass parameters to procedures: – Passing by

Why pass by reference? • Previously, used parameters to pass data into a procedure

What can be passed • Pass by value – both literals and variables can

Two results? • Total and Average algorithms share a lot of code • Useful

Example: Total and Average Sub Tot. Ave(By. Ref T, By. Ref A) Dim i

Questions: Parameter Passing • Consider the following code: Dim a Sub Add(By. Ref item,

Tutorial Exercise: Clock • LEARNING OBJECTIVE: – use parameters provided by event procedures •

Slides: 27

Download presentation

10 – Parameters Mark Dixon SOFT 131 Page 1

Session Aims & Objectives • Aims – To introduce passing parameters/arguments to procedures to make them more general purpose • Objectives, after this week’s sessions, you should be able to: – use parameters in your programs to make procedures more flexible – pass parameters by reference and by value – distinguish between formal and actual parameters Mark Dixon SOFT 131 Page 2

Example: Clock (analysis) SPECIFICATION • User Requirements – to know what the time is • Software Requirements – Functional: – display current time in analogue (traditional clock face) format – Non-functional should be easy to read Mark Dixon SOFT 131 Page 3

Example: Clock (user interface) • 14 objects: – 12 numbers – mid point – second point (moving) Mark Dixon SOFT 131 Page 4

Example: Clock v 0 (HTML) <html> <head><title></head> <body> <div id=div 1 style="position: absolute; ">1</div> <div id=div 2 style="position: absolute; ">2</div> <div id=div 3 style="position: absolute; ">3</div> <div id=div 4 style="position: absolute; ">4</div> <div id=div 5 style="position: absolute; ">5</div> <div id=div 6 style="position: absolute; ">6</div> <div id=div 7 style="position: absolute; ">7</div> <div id=div 8 style="position: absolute; ">8</div> <div id=div 9 style="position: absolute; ">9</div> <div id=div 10 style="position: absolute; ">10</div> <div id=div 11 style="position: absolute; ">11</div> <div id=div 12 style="position: absolute; ">12</div> <img id=img. Mid style="position: absolute; " src=dot. gif /> <img id=img. Sec style="position: absolute; " src=dot. gif /> </body> </html> Mark Dixon SOFT 131 Page 5

Example: Clock v 1 (HTML) • Remove 'hard coded' tags <html> <head><title></head> <body> <img id=img. Mid style="position: absolute; " src=dot. gif /> <img id=img. Sec style="position: absolute; " src=dot. gif /> </body> </html> Mark Dixon SOFT 131 Page 6

Example: Clock v 1 (code) Option Explicit • use loop to put in tags Sub window_On. Load() Dim ang Dim s Dim i s = "" For i = 1 To 12 s = s & "<div id=div" & i & " style=""position: absolute; "">" & i & "</div>" Next document. body. inner. HTML = s & document. body. inner. HTML img. Mid. style. pixelleft = document. body. clientwidth / 2 img. Mid. style. pixeltop = document. body. clientheight / 2 ang = 6. 2 / 12 div 1. style. pixelleft = img. Mid. style. pixelleft + Sin(ang) * 200 div 1. style. pixeltop = img. Mid. style. pixeltop - Cos(ang) * 200 div 2. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 2) * 200 div 2. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 2) * 200 div 3. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 3) * 200 div 3. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 3) * 200 div 4. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 4) * 200 div 4. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 4) * 200 div 5. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 5) * 200 div 5. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 5) * 200 div 6. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 6) * 200 div 6. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 6) * 200 div 7. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 7) * 200 div 7. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 7) * 200 div 8. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 8) * 200 div 8. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 8) * 200 div 9. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 9) * 200 div 9. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 9) * 200 div 10. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 10) * 200 div 10. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 10) * 200 div 11. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 11) * 200 div 11. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 11) * 200 div 12. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 12) * 200 div 12. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 12) * 200 window. setinterval "Show. Hands", 500 End Sub Show. Hands() Dim ang Dim s ang = 6. 2 / 60 s = Second(Now()) img. Sec. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * s) * 200 img. Sec. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * s) * 200 End Sub Mark Dixon Sub window_On. Load() Dim ang Dim s Dim i s = "" For i = 1 To 12 s = s & "<div id=div" & i & " style=""position: absolute; "">" & Next document. body. inner. HTML = s & document. body. inner. HTML img. Mid. style. pixelleft = document. body. clientwidth / 2 img. Mid. style. pixeltop = document. body. clientheight / 2 ang = 6. 2 / 12 div 1. style. pixelleft = img. Mid. style. pixelleft + Sin(ang) * 200 div 1. style. pixeltop = img. Mid. style. pixeltop - Cos(ang) * 200 … … … div 12. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 12) * 200 div 12. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 12) * 200 window. setinterval "Show. Hands", 500 End Sub SOFT 131 Page 7

Example: Clock v 1 (code) Option Explicit Sub window_On. Load() Dim ang Dim s Dim i s = "" For i = 1 To 12 s = s & "<div id=div" & i & " style=""position: absolute; "">" & i & "</div>" Next document. body. inner. HTML = s & document. body. inner. HTML img. Mid. style. pixelleft = document. body. clientwidth / 2 img. Mid. style. pixeltop = document. body. clientheight / 2 ang = 6. 2 / 12 div 1. style. pixelleft = img. Mid. style. pixelleft + Sin(ang) * 200 div 1. style. pixeltop = img. Mid. style. pixeltop - Cos(ang) * 200 div 2. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 2) * 200 div 2. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 2) * 200 div 3. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 3) * 200 div 3. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 3) * 200 div 4. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 4) * 200 div 4. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 4) * 200 div 5. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 5) * 200 div 5. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 5) * 200 div 6. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 6) * 200 div 6. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 6) * 200 div 7. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 7) * 200 div 7. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 7) * 200 div 8. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 8) * 200 div 8. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 8) * 200 div 9. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 9) * 200 div 9. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 9) * 200 div 10. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 10) * 200 div 10. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 10) * 200 div 11. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 11) * 200 div 11. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 11) * 200 div 12. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 12) * 200 div 12. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 12) * 200 window. setinterval "Show. Hands", 500 End Sub Show. Hands() Dim ang Dim s ang = 6. 2 / 60 s = Second(Now()) img. Sec. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * s) * 200 img. Sec. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * s) * 200 End Sub Mark Dixon current time and date Sub Show. Hands() Dim ang Dim s ang = 6. 2 / 60 s = Second(Now()) img. Sec. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * s) img. Sec. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * s) End Sub SOFT 131 Page 8

Example: Clock v 1 (code) Option Explicit Sub window_On. Load() Dim ang Dim s Dim i s = "" For i = 1 To 12 s = s & "<div id=div" & i & " style=""position: absolute; "">" & i & "</div>" Next document. body. inner. HTML = s & document. body. inner. HTML img. Mid. style. pixelleft = document. body. clientwidth / 2 img. Mid. style. pixeltop = document. body. clientheight / 2 ang = 6. 2 / 12 div 1. style. pixelleft = img. Mid. style. pixelleft + Sin(ang) * 200 div 1. style. pixeltop = img. Mid. style. pixeltop - Cos(ang) * 200 div 2. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 2) * 200 div 2. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 2) * 200 div 3. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 3) * 200 div 3. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 3) * 200 div 4. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 4) * 200 div 4. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 4) * 200 div 5. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 5) * 200 div 5. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 5) * 200 div 6. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 6) * 200 div 6. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 6) * 200 div 7. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 7) * 200 div 7. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 7) * 200 div 8. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 8) * 200 div 8. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 8) * 200 div 9. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 9) * 200 div 9. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 9) * 200 div 10. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 10) * 200 div 10. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 10) * 200 div 11. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 11) * 200 div 11. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 11) * 200 div 12. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 12) * 200 div 12. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 12) * 200 window. setinterval "Show. Hands", 500 End Sub Show. Hands() Dim ang Dim s ang = 6. 2 / 60 s = Second(Now()) img. Sec. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * s) * 200 img. Sec. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * s) * 200 End Sub Mark Dixon Sub window_On. Load() Dim ang Dim s Dim i s = "" For i = 1 To 12 s = s & "<div id=div" & i & " style=""position: absolute; "">" & i & "</ Next document. body. inner. HTML = s & document. body. inner. HTML img. Mid. style. pixelleft = document. body. clientwidth / 2 img. Mid. style. pixeltop = document. body. clientheight / 2 ang = 6. 2 / 12 div 1. style. pixelleft = img. Mid. style. pixelleft + Sin(ang) * 200 div 1. style. pixeltop = img. Mid. style. pixeltop - Cos(ang) * 200 div 2. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 2) * 200 div 2. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 2) * 200 … … … div 10. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 10) * 20 div 10. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 10) * 20 div 11. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 11) * 20 div 11. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 11) * 20 div 12. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 12) * 20 div 12. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 12) * 20 window. setinterval "Show. Hands", 500 End Sub SOFT 131 Page 9

Example: Clock v 1 (code) Option Explicit • same 2 lines duplicated Sub window_On. Load() Dim ang Dim s Dim i s = "" For i = 1 To 12 s = s & "<div id=div" & i & " style=""position: absolute; "">" & i & "</div>" Next document. body. inner. HTML = s & document. body. inner. HTML img. Mid. style. pixelleft = document. body. clientwidth / 2 img. Mid. style. pixeltop = document. body. clientheight / 2 ang = 6. 2 / 12 div 1. style. pixelleft = img. Mid. style. pixelleft + Sin(ang) * 200 div 1. style. pixeltop = img. Mid. style. pixeltop - Cos(ang) * 200 div 2. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 2) * 200 div 2. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 2) * 200 div 3. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 3) * 200 div 3. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 3) * 200 div 4. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 4) * 200 div 4. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 4) * 200 div 5. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 5) * 200 div 5. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 5) * 200 div 6. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 6) * 200 div 6. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 6) * 200 div 7. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 7) * 200 div 7. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 7) * 200 div 8. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 8) * 200 div 8. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 8) * 200 div 9. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 9) * 200 div 9. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 9) * 200 div 10. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 10) * 200 div 10. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 10) * 200 div 11. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 11) * 200 div 11. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 11) * 200 div 12. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 12) * 200 div 12. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 12) * 200 window. setinterval "Show. Hands", 500 End Sub Show. Hands() Dim ang Dim s ang = 6. 2 / 60 s = Second(Now()) img. Sec. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * s) * 200 img. Sec. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * s) * 200 End Sub Mark Dixon – not identical • different object • different angle Sub Show. Hands() Dim ang Dim s ang = 6. 2 / 60 s = Second(Now()) img. Sec. style. pixelleft = img. Mid. style. pixelleft + Sin(ang img. Sec. style. pixeltop = img. Mid. style. pixeltop - Cos(ang End Sub SOFT 131 Page 10

Problem: Inflexible Procedure • Procedure does exactly the same each time Sub Show. Hands() Dim ang Dim s ang = 6. 2 / 60 s = Second(Now()) Position End Sub Position() img. Sec. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * s) * 200 img. Sec. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * s) * 200 End Sub Mark Dixon SOFT 131 Page 11

Parameters/Arguments (what) • Sometimes procedures need information – Making a cup of tea: • milk, and number of sugars Milk Sugars Make cup of tea • Makes them more flexible Mark Dixon SOFT 131 Page 12

Parameters (how) • Procedure Declaration – Formal parameters define name Option Explicit Dim res Sub Calc(Num 1, Num 2) res = Num 1 * Num 2 End Sub • Procedure Call Sub btn. Calc_Click() Calc 5, 2 Calc 11, 15 End Sub – actual parameters list values in order Mark Dixon SOFT 131 Page 13

Parameters (how) Mark Dixon SOFT 131 Page 14

Questions: Parameters Given the following declaration: Sub thing(Num 1, Num 2, Num 3) Dim tmp. Output = (Num 1 + Num 2) * Num 3 par. Res. inner. Text = tmp. Output End Sub • What will the following put in par. Res? 30 18 50 thing 2, 3, 6 thing 6, 3, 2 thing 20, 5, 2 Mark Dixon SOFT 131 Page 15

Example: Clock v 2 (code) Option Explicit Sub window_On. Load() Dim ang Dim s Dim i s = "" For i = 1 To 12 s = s & "<div id=div" & i & " style=""position: absolute; "">" & i & "</div>" Next document. body. inner. HTML = s & document. body. inner. HTML img. Mid. style. pixelleft = document. body. clientwidth / 2 img. Mid. style. pixeltop = document. body. clientheight / 2 ang = 6. 2 / 12 Position div 1, ang Position div 2, ang * 2 Position div 3, ang * 3 Position div 4, ang * 4 Position div 5, ang * 5 Position div 6, ang * 6 Position div 7, ang * 7 Position div 8, ang * 8 Position div 9, ang * 9 Position div 10, ang * 10 Position div 11, ang * 11 Position div 12, ang * 12 window. setinterval "Show. Hands", 500 End Sub Show. Hands() Dim ang Dim s ang = 6. 2 / 60 s = Second(Now()) Position img. Sec, ang * s End Sub Position(obj. O, a) obj. O. style. pixelleft = img. Mid. style. pixelleft + Sin(a) * 200 obj. O. style. pixeltop = img. Mid. style. pixeltop - Cos(a) * 200 End Sub Mark Dixon Position div 1, ang Position div 2, ang * 2 Position div 3, ang * 3 Position div 4, ang * 4 … … … Position div 9, ang * 9 Position div 10, ang * 10 Position div 11, ang * 11 Position div 12, ang * 12 Position img. Sec, ang * s Sub Position(obj. O, a) obj. O. style. pixelleft = img. Mid. style. pixelleft + Sin( obj. O. style. pixeltop = img. Mid. style. pixeltop - Cos End Sub SOFT 131 Page 16

Comparison of Clock Code v 0 (64 lines) (2474 bytes) <html> <head><title></head> <body> <div id=div 1 style="position: absolute; ">1</div> <div id=div 2 style="position: absolute; ">2</div> <div id=div 3 style="position: absolute; ">3</div> <div id=div 4 style="position: absolute; ">4</div> <div id=div 5 style="position: absolute; ">5</div> <div id=div 6 style="position: absolute; ">6</div> <div id=div 7 style="position: absolute; ">7</div> <div id=div 8 style="position: absolute; ">8</div> <div id=div 9 style="position: absolute; ">9</div> <div id=div 10 style="position: absolute; ">10</div> <div id=div 11 style="position: absolute; ">11</div> <div id=div 12 style="position: absolute; ">12</div> <img id=img. Mid style="position: absolute; " src=dot. gif /> <img id=img. Sec style="position: absolute; " src=dot. gif /> </body> </html> <script language=VBScript> Option Explicit Sub window_On. Load() Dim ang img. Mid. style. pixelleft = document. body. clientwidth / 2 img. Mid. style. pixeltop = document. body. clientheight / 2 ang = 6. 2 / 12 div 1. style. pixelleft = img. Mid. style. pixelleft + Sin(ang) * 200 div 1. style. pixeltop = img. Mid. style. pixeltop - Cos(ang) * 200 div 2. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 2) * 200 div 2. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 2) * 200 div 3. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 3) * 200 div 3. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 3) * 200 div 4. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 4) * 200 div 4. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 4) * 200 div 5. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 5) * 200 div 5. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 5) * 200 div 6. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 6) * 200 div 6. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 6) * 200 div 7. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 7) * 200 div 7. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 7) * 200 div 8. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 8) * 200 div 8. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 8) * 200 div 9. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 9) * 200 div 9. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 9) * 200 div 10. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 10) * 200 div 10. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 10) * 200 div 11. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 11) * 200 div 11. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 11) * 200 div 12. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 12) * 200 div 12. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 12) * 200 window. setinterval "Show. Hands", 500 End Sub Show. Hands() Dim ang Dim s ang = 6. 2 / 60 s = Second(Now()) img. Sec. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * s) * 200 img. Sec. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * s) * 200 End Sub </script> Mark Dixon v 1 (59 lines) (2064 bytes) v 2 (51 lines) (941 bytes) <html> <head><title></title></head> <body> <img id=img. Mid style="position: absolute; " src=dot. gif /> <img id=img. Sec style="position: absolute; " src=dot. gif /> </body> </html> <script language=VBScript> Option Explicit Sub window_On. Load() Dim ang Dim s Dim i s = "" For i = 1 To 12 s = s & "<div id=div" & i & " style=""position: absolute; "">" & i & "</div>" Next document. body. inner. HTML = s & document. body. inner. HTML img. Mid. style. pixelleft = document. body. clientwidth / 2 img. Mid. style. pixeltop = document. body. clientheight / 2 ang = 6. 2 / 12 div 1. style. pixelleft = img. Mid. style. pixelleft + Sin(ang) * 200 div 1. style. pixeltop = img. Mid. style. pixeltop - Cos(ang) * 200 div 2. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 2) * 200 div 2. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 2) * 200 div 3. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 3) * 200 div 3. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 3) * 200 div 4. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 4) * 200 div 4. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 4) * 200 div 5. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 5) * 200 div 5. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 5) * 200 div 6. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 6) * 200 div 6. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 6) * 200 div 7. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 7) * 200 div 7. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 7) * 200 div 8. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 8) * 200 div 8. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 8) * 200 div 9. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 9) * 200 div 9. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 9) * 200 div 10. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 10) * 200 div 10. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 10) * 200 div 11. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 11) * 200 div 11. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 11) * 200 div 12. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * 12) * 200 div 12. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * 12) * 200 window. setinterval "Show. Hands", 500 End Sub Show. Hands() Dim ang Dim s ang = 6. 2 / 60 s = Second(Now()) img. Sec. style. pixelleft = img. Mid. style. pixelleft + Sin(ang * s) * 200 img. Sec. style. pixeltop = img. Mid. style. pixeltop - Cos(ang * s) * 200 End Sub </script> SOFT 131 Sub window_On. Load() Dim ang Dim s Dim i s = "" For i = 1 To 12 s = s & "<div id=div" & i & " style=""position: absolute; "">" & i & "</div>" Next document. body. inner. HTML = s & document. body. inner. HTML img. Mid. style. pixelleft = document. body. clientwidth / 2 img. Mid. style. pixeltop = document. body. clientheight / 2 ang = 6. 2 / 12 Position div 1, ang Position div 2, ang * 2 Position div 3, ang * 3 Position div 4, ang * 4 Position div 5, ang * 5 Position div 6, ang * 6 Position div 7, ang * 7 Position div 8, ang * 8 Position div 9, ang * 9 Position div 10, ang * 10 Position div 11, ang * 11 Position div 12, ang * 12 window. setinterval "Show. Hands", 500 End Sub Show. Hands() Dim ang Dim s ang = 6. 2 / 60 s = Second(Now()) Position img. Sec, ang * s End Sub Position(obj. O, a) obj. O. style. pixelleft = img. Mid. style. pixelleft + Sin(a) * 200 obj. O. style. pixeltop = img. Mid. style. pixeltop - Cos(a) * 200 End Sub </script> Page 17

Example: Clock v 3 For i = 1 To 12 Position document. body. children("div" & i), 200, ang * i Next Mark Dixon SOFT 131 Page 18

Memory Addresses • Memory addresses - keep track of where variables are stored in memory • Every byte (position) in memory has a memory address: Computer Memory 0 63542 x 23 Identifier Value • e. g. variable identified by name x stored at location 63542 (address of the first byte of data for variable x) Mark Dixon SOFT 131 Page 19

Example: Change the Value Mark Dixon SOFT 131 Page 20

Parameter Passing Methods • 2 ways to pass parameters to procedures: – Passing by Value: literal value is passed from the call to the definition Sub Change 1(By. Val x) … End Sub – Passing by Reference: variable’s memory address (a reference to the variables position in memory) is passed from the call to the definition Sub Change 2(By. Ref y) … End Sub Mark Dixon SOFT 131 Page 21

Why pass by reference? • Previously, used parameters to pass data into a procedure (input) Change By. Val x • Pass by reference, allows: – the procedure to change the value of the passed variable – data to be input and output via parameters Set By. Ref x Mark Dixon SOFT 131 Page 22

What can be passed • Pass by value – both literals and variables can be passed (variables are substituted by their value) Change 1 y Change 1 21 • Pass by reference – only variables can be passed (in fact the variable’s memory address is passed) Change 2 y Change 2 21 ERROR literals cannot be passed – they have no memory address Mark Dixon SOFT 131 Page 23

Two results? • Total and Average algorithms share a lot of code • Useful to combine them • Tot. Ave procedure: Tot. Ave Mark Dixon SOFT 131 integer double (total) (average) Page 24

Example: Total and Average Sub Tot. Ave(By. Ref T, By. Ref A) Dim i T = 0 For i = 1 to 5 T = T + Nums(i) Next A = T / 5 End Sub tot = 0 ave = 0 Tot. Ave tot, ave Mark Dixon var T var A Tot. Ave ' What is the value of ave and tot? SOFT 131 Page 25

Questions: Parameter Passing • Consider the following code: Dim a Sub Add(By. Ref item, By. Val extra) item = item + extra End Sub a=5 • What is the value of a, after each of these: 8 Add a, 3 Add a, a 16 Add 4, 4 Mark Dixon Error – cannot pass 4 by reference SOFT 131 Page 26

Tutorial Exercise: Clock • LEARNING OBJECTIVE: – use parameters provided by event procedures • Task 1: Get the Clock (v 2) example (from the lecture) working. • Task 2: Modify your code – display lots of dots for the second hand (as per v 3). • Task 3: Modify your code – add an hour and minute hand Mark Dixon SOFT 131 Page 27