04 – data types
DESCRIPTION
04 – Data Types. Admin: On-line Quiz. Questions: Expressions. What is the result of: 10 * Int(3.1973265765) How many functions are in the following: Int(12.472) * Sqr(9) + 8 / 2 How many operators are in the following: Int(12.472) * Sqr(9) + 8 / 2 - PowerPoint PPT PresentationTRANSCRIPT
Mark Dixon Page 1
04 – Data Types
Mark Dixon Page 2
Admin: On-line Quiz
Mark Dixon Page 3
Questions: Expressionsa) What is the result of:
10 * Int(3.1973265765)
b) How many functions are in the following:
Int(12.472) * Sqr(9) + 8 / 2
c) How many operators are in the following:
Int(12.472) * Sqr(9) + 8 / 2
d) Write an expression to:
divide 15 by 3 and multiply the result by 6
30
2
3
(15 / 3) * 6
Mark Dixon Page 4
Session Aims & Objectives• Aims
– to introduce the idea of types of data
• Objectives,by end of this week’s sessions, you should be able to:
– recognise different types of data• numeric• string (text)
– correct errors relating to data types
Mark Dixon Page 5
Example: AddNum v1<html> <head><title>Add Numbers</title></head> <body> <input type="text" id="txtNum1" /><br /> <input type="text" id="txtNum2" /><br /> <input type="button" id="btnAdd" value="Add" /> <p id="lblResult"></p> </body></html>
<script language="vbscript"> Sub btnAdd_OnClick() lblResult.InnerText = txtNum1.Value + txtNum2.Value End Sub</script>Doesn't work!
Mark Dixon Page 6
Types of Information• Numeric (numbers) 29 (integer/whole) 56.23 (real/decimal)
• String (text) "Hello there!""BOO"
• Pictures (numbers)
• Sound (numbers)
Mark Dixon Page 7
AddNum problem• The + operator works with:
– numbers, and
– text
23 + 16 39
"23" + "16" "2316"
double quotes enclose text
• Text input boxes store text: txtNum1.value + txtNum2.value
• We need to convert text to numbers
Mark Dixon Page 8
String Functions CInt("63") convert to integer result is 63
Left("boo",2) left string result is "bo"
Right("hello",3) right string result is "llo"
Mid("hello",2,3) middle string result is "ell"
Len("S Smith") length result is 7
Space(5) spaces result is " "
Mark Dixon Page 9
String Expressions
Mark Dixon Page 10
String Expressions & Errors "What is " & txtN1.Value & " times "
"What is twice " txtN1.Value & "?"
"What is 6 minus " & & txtN1.Value & "?"
"This is a number & txtN1.Value
dataoperator
data data
operator
ERROR! missing data
ERROR! missing operator
ERROR! missing "
Mark Dixon Page 11
Questions: String Expressionsa) What is the result of:
Mid("what is the time?", 3, 4)
b) What is the result of: Left("bob", 2) & Right("sal", 1)
c) Write an expression to:convert "16" to a number
d) Write an expression to:give the first two letters of "Mr John Smith"
"at i"
"bol"
CInt("16")
Left("Mr John Smith", 2)
Mark Dixon Page 12
Example: AddNum v2<html> <head><title>Add Numbers</title></head> <body> <input id="txtNum1" type="text" /><br /> <input id="txtNum2" type="text" /><br /> <input id="btnAdd" type="button" value="Add" /> <p id="lblResult"></p> </body></html>
<script language="vbscript"> Sub btnAdd_OnClick() lblResult.InnerText = CInt(txtNum1.Value) + CInt(txtNum2.Value) End Sub</script>
Mark Dixon Page 13
Example: Sound<html> <head><title>Sound</title></head> <body> <object id="sndPlayer" classid="clsid:6BF52A52-394A-11d3-B153-00C04F79FAA6" style="width:0px; height:0px;"> </object> <input id="btnFart" type="button" value="Fart" /> </body></html>
<script language="vbscript"> Sub btnFart_onclick() sndPlayer.url = "Fart.wav" End Sub</script>
Mark Dixon Page 14
Nested functions• nested functions (one inside another): Right(Left("Hello there", 5), 2)
• do what is in the brackets first
Right(Left("Hello there", 5), 2)
= Right( "Hello" , 2)
= "lo"
Mark Dixon Page 15
Humans vs. Computers• Humans and Computers work very differently• Humans
– declarative (goals): flexible sequence– intelligent: adaptive, questioning, rational– instinctive (without conscious thinking)– easily deal with incomplete and incorrect data– error prone (especially mundane repetitive tasks)
• Computers– procedural / algorithmic: fixed sequence– do exactly what they are told– cannot deal with errors– no imagination or creativity
Mark Dixon Page 16
Algorithms• algorithm: step-by-step sequence of
instructions, to solve a problem
• it describes how input data is to be processed in order to produce a desired output
• recipe– ingredients (similar to data)– method (is a type of algorithm)
Mark Dixon Page 17
Algorithms• Making a cup of tea:
1. Fill the kettle with water 2. Plug the kettle in 3. Switch the kettle on 4. Wait for the kettle to boil 5. Put water in cup 6. Put a tea bag into the cup 7. Add sugar to the cup 8. Add milk to the cup 9. Stir 10. Take the tea bag out
Mark Dixon Page 18
What vs. How• problem solving
– known problems (remember solution)– unfamiliar problems (creative process, imagination)
• what vs. how:– What: increase value of a text box by 1– How:
• read the current value• add 1• put the result back in the text box
• For example: swap, search, sort
Mark Dixon Page 19
Example: Swap v1
<html> <head><title>Swap</title></head> <body> <input id="txtA" type="text" value="Bob" /> <input id="txtB" type="text" value="Sally" /> <input id="btnSwap" type="button" value="Swap" /> </body></html>
<script language="vbscript"> Sub btnSwap_onclick() txtA.value = txtB.value txtB.value = txtA.value End Sub</script>
• put txtB into txtA• put txtA into txtB
• does not work!
Mark Dixon Page 20
Example: Swap v1 (why?)
Mark Dixon Page 21
Example: Swap v2<html> <head><title>Swap</title></head> <body> <input id="txtA" type="text" value="Bob" /> <input id="txtB" type="text" value="Sally" /> <input id="btnSwap" type="button" value="Swap" /> <input id="txtTemp" type="text" disabled="disabled" /> </body></html>
<script language="vbscript"> Sub btnSwap_onclick() txtTemp.value = txtA.value txtA.value = txtB.value txtB.value = txtTemp.value End Sub</script>
• put txtA into temp• put txtB into txtA• put temp into txtB
• works!
Mark Dixon Page 22
Example: Swap v2 (Why?)
Mark Dixon Page 23
Example: Student Loan (Analysis)
• What: Calculate annual student load repayment from salary
• How:
• Algorithm:– read annual salary– deduct £15000– calculate 9%– display result
Mark Dixon Page 24
Example: Student Loan (Design)• When Calculate button
is clicked:– read annual salary text
box– deduct £15000– calculate 9%– put result in paragraph
• Test Data: Input Process Output
– £15000 15000-15000*0.09 = £0– £16000 16000-15000*0.09 = £90
Mark Dixon Page 25
Concrete vs. Abstract code• we have:
– pixelLeft– pixelTop
• right = left + width
• middle = left + (width / 2)• concrete vs. abstract code:
picBall.style.pixelLeft = 400 picBall.style.pixelLeft = document.body.clientWidth / 2
• first one only works when the window width is 800
Mark Dixon Page 26
Generating Assignment Code• put "Hello" into txtA
txtA.value = "Hello"
• get txtA and join it with txtB, and put the result in parRes parRes.innerText = txtA.value + txtB.value
• put into txtNum2, the result of multiplying txtNum1 by 2
txtNum2.innerText = txtNum1.value * 2
Mark Dixon Page 27
Questions: Assignment• What is the code for:
– put 0 into the pixelLeft property of picHouse
– increase the pixelTop property of picHouse by 5
– decrease the pixelTop property of picCar by 9
picHouse.style.pixelLeft = 0
picHouse.style.pixelTop = picHouse.style.pixelTop + 5
picCar.style.pixelTop = picCar.style.pixelTop - 9
Mark Dixon Page 28
Errors• txtTemp.value = "" + 5
type mismatch (cannot add "" to 5)
• txtTemp.value = "7" + 5 OK – VB converts "7" into 7 automatically
Mark Dixon Page 29
Example: Text Shift<html> <head><title>Text Shift</title></head> <body> <p id="parH"></p> </body></html>
<script language="vbscript"> Sub Window_OnLoad() parH.innertext = "Hello There" & Space(100) Window.SetInterval "TextShift", 50 End Sub Sub TextShift() parH.innertext = Mid(parH.innertext,2) & Left(parH.innerText,1) End Sub</script>
Mark Dixon Page 30
Tutorial Exercises: AddNum• LEARNING OBJECTIVE:
use a function to convert string (text) to integer (number) data
• Task 1: get the addnum examples (v1 and v2) working
Mark Dixon Page 31
Tutorial Exercises: Swap• LEARNING OBJECTIVE:
use an algorithm to solve a problem
• Task 1: get the swap examples (v1 and v2) working• Task 2: change v2 of the swap page so that the temporary text
box is hidden
Mark Dixon Page 32
Tutorial Exercises: Student Loan• LEARNING OBJECTIVE:
implement an algorithm in code
• Task 1: Create the user interface (page design) for the Student Loan example (from the lecture), using HTML tags (you will need a text box, a button, and a paragraph).
• Task 2: Add code that implements the following algorithm:When the Calculate button is clicked:– read annual salary text box– deduct £15000– calculate 9%– put result in paragraph
• Task 3: Modify your program so that it calculates and displays monthly income and repayment amounts (as well an annual).
Mark Dixon Page 33
Tutorial Exercises: Text Shift• LEARNING OBJECTIVE:
develop and implement an algorithm to solve a problemuse string manipulation functions, and sound
• Task 1: get the Text Shift example (from the lecture) working
• Task 2: modify your program so that the text goes the other way.
• Task 3: modify your program so that a noise is made when the user moves the mouse over the text.