lecture 5 java script.pptx
TRANSCRIPT
-
8/17/2019 Lecture 5 Java Script.pptx
1/73
Introduction to Java Script
JavaScript: Control & Looping Statements
-
8/17/2019 Lecture 5 Java Script.pptx
2/73
Control Structures
Sequential execution Statements execute in the order they are written
Transfer of control ext statement to execute may not !e the next one in sequence
Three control structures Sequence structure Selection structure
if if"else switch
#epetition structure while do"while for for"in
-
8/17/2019 Lecture 5 Java Script.pptx
3/73
Control Structures
$lowchart %raphical representation of algorithm or portion of algorithm $lowlines
Indicate the order the actions of the algorithm execute
#ectangle sym!ol Indicate any type of action
val sym!ol ' complete algorithm
Small circle sym!ol ' portion of algorithm
(iamond sym!ol Indicates a decision is to !e made
-
8/17/2019 Lecture 5 Java Script.pptx
4/73
Control Structures
add grade to total total = total + grade;
add 1 to counter counter = counter + 1;
Flowcharting JavaScript’s sequence structure.
-
8/17/2019 Lecture 5 Java Script.pptx
5/73
JavaScript )eywords
JavaScriptKeywords
break case catch continue default delete do else finally for function if in instanceof new return switch this throw try typeof var void while with
Keywords thatare reserved but
not currently
used by JavaScript
abstract boolean byte char class const debugger double enum export
extends final float goto implements import int interface long native package private protected public short static super synchronized throws transient volatile
Fig. 8.2 JavaScript keywords.
-
8/17/2019 Lecture 5 Java Script.pptx
6/73
if Selection Statement
Single*entry+single*exit structure
Indicate action only when the condition evaluates totrue
-
8/17/2019 Lecture 5 Java Script.pptx
7/73
if Selection Statement
grade > !"true
#alse
print $%assed&
Flowcharting the single'selectionif
state(ent.
-
8/17/2019 Lecture 5 Java Script.pptx
8/73
if…else Selection Statement
Indicate different actions to !e perform whencondition is true or false
Conditional operator ,?-
JavaScript.s only ternary operator Three operands
$orms a conditional expression
-
8/17/2019 Lecture 5 Java Script.pptx
9/73
if…else Selection Statement
grade > !" true
print $Failed&
#alse
print $%assed&
Flowcharting the dou)le'selection if*else state(ent.
-
8/17/2019 Lecture 5 Java Script.pptx
10/73
while #epetition Statement
#epetition structure ,loop- #epeat action while some condition remains true
-
8/17/2019 Lecture 5 Java Script.pptx
11/73
while #epetition Statement
product + 1!!!product
" #
producttrue
#alse
Flowcharting the while repetition state(ent.
-
8/17/2019 Lecture 5 Java Script.pptx
12/73
$ormulating 'lgorithms:Case Study / ,Counter*Controlled #epetition-
Counter*controlled repetition Counter
Control the num!er of times a set of statements executes
(efinite repetition
-
8/17/2019 Lecture 5 Java Script.pptx
13/73
average0html,/ of 1-
-
8/17/2019 Lecture 5 Java Script.pptx
14/73
average0html,2 of 1-
24 // Processing Phase
25 while ( gradeCounter
-
8/17/2019 Lecture 5 Java Script.pptx
15/73
48
49
-
8/17/2019 Lecture 5 Java Script.pptx
16/73
$ormulating 'lgorithms with Top*(own3 Stepwise#efinement: Case Study 2 ,4ser*Controlled #epetition-
Indefinite repetition Sentinel ,4ser Controlled- value
-
8/17/2019 Lecture 5 Java Script.pptx
17/73
average20html,/ of 1-
-
8/17/2019 Lecture 5 Java Script.pptx
18/73
average20html,2 of 1-
25 // Processing phase
26 // prompt for input and read grade from user
27 grade = window.prompt(
28 "nter &nteger rade -1 to 2uit!" "0" )#
29
30 // con$ert grade from a string to an integer31 grade%alue = parse&nt( grade )#
32
33 while ( grade%alue 3= -1 ) {
34 // add grade%alue to total
35 total = total ' grade%alue#
36
37 // add 1 to gradeCounter
38 gradeCounter = gradeCounter ' 1#
39
40 // prompt for input and read grade from user
41 grade = window.prompt(
42 "nter &nteger rade -1 to 2uit!" "0" )#
43
44 // con$ert grade from a string to an integer
45 grade%alue = parse&nt( grade )#
46
47
-
8/17/2019 Lecture 5 Java Script.pptx
19/73
average20html,1 of 1-
48 // ermination phase
49 if ( gradeCounter 3= 0 ) {
50 a$erage = total / gradeCounter#
51
52 // displa* a$erage of e+am grades
53 document.writeln(
54 "
-
8/17/2019 Lecture 5 Java Script.pptx
20/73
-
8/17/2019 Lecture 5 Java Script.pptx
21/73
$ormulating 'lgorithms with Top*(own3 Stepwise#efinement: Case Study 1 ,ested Control Structures-
Consider pro!lem
5a6e o!servations
Top*down3 stepwise refinement
-
8/17/2019 Lecture 5 Java Script.pptx
22/73
analysis0html,/ of 2-
1
-
8/17/2019 Lecture 5 Java Script.pptx
23/73
analysis0html,2 of 2-
25 if ( result == "1" )
26 passes = passes ' 1#
27 else
28 failures = failures ' 1#
29
30 student = student ' 1#31
32
33 // termination phase
34 document.writeln( "
-
8/17/2019 Lecture 5 Java Script.pptx
24/73
-
8/17/2019 Lecture 5 Java Script.pptx
25/73
-
8/17/2019 Lecture 5 Java Script.pptx
26/73
'ssignment perators
Compound assignment operators '!!reviate assignment expressions
-
8/17/2019 Lecture 5 Java Script.pptx
27/73
'ssignment perators
-
8/17/2019 Lecture 5 Java Script.pptx
28/73
Increment and (ecrement perators
7reincrement or predecrement operator Increment of decrement operator placed !efore a varia!le
7ostincrement or postdecrement operator Increment of decrement operator placed after a varia!le
-
8/17/2019 Lecture 5 Java Script.pptx
29/73
Increment and (ecrement perators
1
-
8/17/2019 Lecture 5 Java Script.pptx
30/73
increment0html,/ of 2-
1
-
8/17/2019 Lecture 5 Java Script.pptx
31/73
26 // increment then print K
27 document.writeln( "
-
8/17/2019 Lecture 5 Java Script.pptx
32/73
Increment and (ecrement perators
-
8/17/2019 Lecture 5 Java Script.pptx
33/73
8ssentials of Counter*Controlled #epetition
Counter*controlled repetition ame of a control Initial value Increment or decrement $inal value
-
8/17/2019 Lecture 5 Java Script.pptx
34/73
9hileCounter0html,/ of 2-
1
-
8/17/2019 Lecture 5 Java Script.pptx
35/73
9hileCounter0html,2 of 2-
25
-
8/17/2019 Lecture 5 Java Script.pptx
36/73
for #epetition Statement
for repetition statement andles all the details of counter*controlled repetition
-
8/17/2019 Lecture 5 Java Script.pptx
37/73
$orCounter0html,/ of /-
1
-
8/17/2019 Lecture 5 Java Script.pptx
38/73
-
8/17/2019 Lecture 5 Java Script.pptx
39/73
for #epetition Statement
for $ var counter = 1; counter %=&; ++counter '
Initial value o# control varia)le Increment o# control varia)le
,ontrol varia)le name Final value o# control varia)le
#or which the condition is true
for keyword
-oop'continuation condition
-
8/17/2019 Lecture 5 Java Script.pptx
40/73
for #epetition Statement
counter %= &
document(writeln$
)%p style=*)fontsize ) + counter +
)ex*),-./0 font size ) +
counter + )ex%2p,) ';
true
#alse
var counter = 1
++counter
sta)lish
initial valueo# control
varia)le.
/eter(ine
i# final value
o# control
varia)lehas )een
reached.
0ody o# loop
this (ay )e (any
state(ents
Increment
the control
varia)le.
Fig. 3.4 for repetition structure #lowchart.
-
8/17/2019 Lecture 5 Java Script.pptx
41/73
8xamples 4sing the for Statement
Summation with for
Compound interest calculation with for loop 0ath o!;ect
5ethod pow
5ethod round
1
-
8/17/2019 Lecture 5 Java Script.pptx
42/73
Sum0html,/ of /-
1
-
8/17/2019 Lecture 5 Java Script.pptx
43/73
-
8/17/2019 Lecture 5 Java Script.pptx
44/73
Interest0html,/ of 2-
1
-
8/17/2019 Lecture 5 Java Script.pptx
45/73
Interest0html,2 of 2-
26 for ( $ar *ear = 1# *ear
-
8/17/2019 Lecture 5 Java Script.pptx
46/73
switch 5ultiple*Selection Statement
Controlling expressionCase la!els
(efault case
-
8/17/2019 Lecture 5 Java Script.pptx
47/73
SwitchTest0html,/ of 1-
1
-
8/17/2019 Lecture 5 Java Script.pptx
48/73
SwitchTest0html
,2 of 1-
( ) {
24 case "1"!
25 startag = "
-
8/17/2019 Lecture 5 Java Script.pptx
49/73
SwitchTest0html
,1 of 1-
49 document.writeln( endag )#
50
51 else
52 document.writeln( "&n$alid choice! " ' choice )#
53 // --,
54
-
8/17/2019 Lecture 5 Java Script.pptx
50/73
-
8/17/2019 Lecture 5 Java Script.pptx
51/73
-
8/17/2019 Lecture 5 Java Script.pptx
52/73
switch 5ultiple*Selection Statement
case a case a actionstrue
#alse
.
.
.
break
case ) actions break
#alse
#alse
case 5 case 5 actions break
default actions
true
true
case )
-
8/17/2019 Lecture 5 Java Script.pptx
53/73
do"while #epetition Statement
Similar to the while statementTests the loop continuation condition after the loop
!ody executes
Loop !ody always executes at least once
1 5 l i "1 0"5
-
8/17/2019 Lecture 5 Java Script.pptx
54/73
(o9hileTest0html
,/ of 2-
1
-
8/17/2019 Lecture 5 Java Script.pptx
55/73
26
-
8/17/2019 Lecture 5 Java Script.pptx
56/73
do…while #epetition Structure
conditiontrue
actions
#alse
-
8/17/2019 Lecture 5 Java Script.pptx
57/73
break and continue Statements
break Immediate exit from the structure 4sed to escape early from a loop S6ip the remainder of a switch statement
continue S6ips the remaining statements in the !ody of the structure 7roceeds with the next iteration of the loop
1
-
8/17/2019 Lecture 5 Java Script.pptx
58/73
-
8/17/2019 Lecture 5 Java Script.pptx
59/73
24 ":roe out of loop at count = " ' count )#
25 // --,
26
-
8/17/2019 Lecture 5 Java Script.pptx
60/73
ContinueTest0html
,/ of 2-
5+ml $ersion 1.0 5
2
-
8/17/2019 Lecture 5 Java Script.pptx
61/73
24 document.writeln( "9sed continue to sip printing J" )#
25 // --,
26
-
8/17/2019 Lecture 5 Java Script.pptx
62/73
La!eled break and continue Statements
La!eled break statement
-
8/17/2019 Lecture 5 Java Script.pptx
63/73
-
8/17/2019 Lecture 5 Java Script.pptx
64/73
-
8/17/2019 Lecture 5 Java Script.pptx
65/73
-
8/17/2019 Lecture 5 Java Script.pptx
66/73
i l
-
8/17/2019 Lecture 5 Java Script.pptx
67/73
Logical perators
5ore logical operators Logical '( , 33 - Logical # , 44 - Logical T , 5 -
i l
-
8/17/2019 Lecture 5 Java Script.pptx
68/73
Logical perators
L i l
-
8/17/2019 Lecture 5 Java Script.pptx
69/73
Logical perators
1
-
8/17/2019 Lecture 5 Java Script.pptx
70/73
Logicalperators0html
,/ of 2-
2
-
8/17/2019 Lecture 5 Java Script.pptx
71/73
Logicalperators0html
,2 of 2-
27 "
-
8/17/2019 Lecture 5 Java Script.pptx
72/73
L i l t
-
8/17/2019 Lecture 5 Java Script.pptx
73/73
Logical perators