forked from gutomaia/inventwithpython
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathchapter4.html
More file actions
682 lines (451 loc) · 54.5 KB
/
chapter4.html
File metadata and controls
682 lines (451 loc) · 54.5 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-5459430-3");
pageTracker._trackPageview();
} catch(err) {}</script>
<meta http-equiv="Content-Type" content="text/html;charset=us-ascii" />
<title>IYOCGwP, Chapter 4 - Guess the Number</title>
<link rel="stylesheet" href="inventbook.css" type="text/css" media="all" />
</head>
<body class='chapter4body'>
<table border='0' width='100%'><tr><td><a href='chapter3.html'>Go to Chapter 3 - Strings</a></td><td align='right'><a href='chapter5.html'>Go to Chapter 5 - Jokes</a></td></tr></table>
<div style='height: 310px;'><a href='http://www.amazon.com/Invent-Your-Computer-Games-Python/dp/0982106017/'><img src='images/buyad.png' align='right'></a></div>
<div style='height: 350px;'><img src='images/chap4.png' /></div>
<div class='inthischapter'><h3 id="TopicsCoveredInThisChapter">Topics Covered In This Chapter:</h3>
<ul>
<li><span class='m'>import</span> statements</li>
<li>Modules</li>
<li>Arguments</li>
<li><span class='m'>while</span> statements</li>
<li>Conditions</li>
<li>Blocks</li>
<li>Booleans</li>
<li>Comparison operators</li>
<li>The difference between <span class='m'>=</span> and <span class='m'>==</span>.</li>
<li><span class='m'>if</span> statements</li>
<li>The <span class='m'>break</span> keyword.</li>
<li>The <span class='m'>str()</span> and <span class='m'>int()</span> functions.</li>
<li>The <span class='m'>random.randint()</span> function.</li>
</ul></div>
<h2 id="TheGuesstheNumberGame">The "Guess the Number" Game</h2>
<p>We are going to make a "Guess the Number" game. In this game, the computer will think of a random number from 1 to 20, and ask you to guess the number. You only get six guesses, but the computer will tell you if your guess is too high or too low. If you guess the number within six tries, you win.</p>
<p>This is a good game for you to start with because it uses random numbers, loops, and input from the user in a fairly short program. As you write this game, you will learn how to convert values to different data types (and why you would need to do this).</p>
<p>Because this program is a game, we'll call the user the <span class='term'>player</span>, but the word "user" would be correct too.</p>
<h2 id="SampleRunofGuesstheNumber">Sample Run of "Guess the Number"</h2>
<p>Here is what our game will look like to the player when the program is run. The text that the player types in is in <b>bold</b>.</p>
<div class='sourceblurb'>
Hello! What is your name?<br />
<b>Albert</b><br />
Well, Albert, I am thinking of a number between 1 and 20.<br />
Take a guess.<br />
<b>10</b><br />
Your guess is too high.<br />
Take a guess.<br />
<b>2</b><br />
Your guess is too low.<br />
Take a guess.<br />
<b>4</b><br />
Good job, Albert! You guessed my number in 3 guesses!<br />
</div>
<p>Enter this code exactly as it appears here, and then save it by clicking on the <span class='menuname'>File</span> menu and then <span class='menuname'>Save As</span>. Give it a file name like <span class='filename'>guess.py</span> then run it by pressing the F5 key. Don't worry if you don't understand the code now, I'll explain it step by step.</p>
<h2 id="GuesstheNumbersSourceCode">Guess the Number's Source Code</h2>
<p>Here is the source code for our Guess the Number game. When you enter this code into the file editor, be sure to pay attention to the spacing at the front of some of the lines. Some lines have four or eight spaces in front of them. After you have typed in the code, save the file as <span class='filename'>guess.py</span>. You can run the program from the file editor by pressing F5. If you see an error message, check that you have typed the program in exactly as written.</p>
<p>If you don't want to type all this code, you can download it from this book's website at the URL <a href='http://inventwithpython.com/chapter4'>http://inventwithpython.com/chapter4</a>.</p>
<p><b>Important Note!</b> Be sure to run this program with Python 3, and not Python 2. The programs in this book use Python 3, and you'll get errors if you try to run them with Python 2. You can click on <span class='menuname'>Help</span> and then <span class='menuname'>About IDLE</span> to find out what version of Python you have.</p>
<div class='sourcecode pagebreaker'><span class='sourcecodeHeader'>guess.py</span><br /><span class='sourcecodeSubHeader'>This code can be downloaded from <a href='http://inventwithpython.com/guess.py'>http://inventwithpython.com/guess.py</a><br />If you get errors after typing this code in, compare it to the book's code with the online diff tool at <a href='http://inventwithpython.com/diff'>http://inventwithpython.com/diff</a> or email the author at <a href="mailto:al@inventwithpython.com">al@inventwithpython.com</a></span><br /><ol start='1'>
<li><span class='comment'># This is a guess the number game.</span></li>
<li>import random</li>
<li></li>
<li>guessesTaken = 0</li>
<li></li>
<li>print('Hello! What is your name?')</li>
<li>myName = input()</li>
<li></li>
<li>number = random.randint(1, 20)</li>
<li>print('Well, ' + myName + ', I am thinking of a number between 1 and 20.')</li>
<li></li>
<li>while guessesTaken < 6:</li>
<li> print('Take a guess.') <span class='comment'># There are four spaces in front of print.</span></li>
<li> guess = input()</li>
<li> guess = int(guess)</li>
<li></li>
<li> guessesTaken = guessesTaken + 1</li>
<li></li>
<li> if guess < number:</li>
<li> print('Your guess is too low.') <span class='comment'># There are eight spaces in front of print.</span></li>
<li></li>
<li> if guess > number:</li>
<li> print('Your guess is too high.')</li>
<li></li>
<li> if guess == number:</li>
<li> break</li>
<li></li>
<li>if guess == number:</li>
<li> guessesTaken = str(guessesTaken)</li>
<li> print('Good job, ' + myName + '! You guessed my number in ' + guessesTaken + ' guesses!')</li>
<li></li>
<li>if guess != number:</li>
<li> number = str(number)</li>
<li> print('Nope. The number I was thinking of was ' + number)</li>
</ol></div>
<p>Even though we are entering our source code into a new file editor window, we can return to the shell to enter individual instructions in order to see what they do. The interactive shell is very good for experimenting with different instructions when we are not running a program. You can return to the interactive shell by clicking on its window or on its taskbar button. In Windows or Mac OS X, the taskbar or dock is on the bottom of the screen. On Linux the taskbar may be located along the top of the screen.</p>
<p>If the program doesn't seem to work after you've typed it, check to see if you have typed the code exactly as it appears in this book. You can also copy and paste your code to the online "diff" tool at <a href='http://inventwithpython.com/diff'>http://inventwithpython.com/diff</a>. The diff tool will show you how your code is different from the source code in this book. In the file editor, press Ctrl-A to "Select All" the text you've typed, then press Ctrl-C to copy the text to the clipboard. Then, paste this text by clicking in the diff tool's text field on the website and click the "Compare" button. The website will show you any differences between your code and the code in this book.</p>
<p>There is a diff tool for each program in this book on the <a href='http://inventwithpython.com'>http://inventwithpython.com</a> website. A video tutorial of how to use the diff tool is available from this book's website at <a href='http://inventwithpython.com/videos/'>http://inventwithpython.com/videos/</a>.</p>
<h2 id="TheimportStatement">The <span class='m'>import</span> Statement</h2>
<p>Let's look at each line of code in turn to see how this program works.</p>
<div class='sourcecode'><ol start='1'>
<li><span class='comment'># This is a guess the number game.</span></li>
</ol></div>
<p>This line is a comment. Comments were introduced in our Hello World program in Chapter 3. Remember that Python will ignore everything after the <span class='m'>#</span> sign. This just reminds us what this program does.</p>
<div class='sourcecode'><ol start='2'>
<li>import random</li>
</ol></div>
<p>This is an <span class='term'>import statement</span>. Statements are not functions (notice that neither <span class='m'>import</span> nor <span class='m'>random</span> has parentheses after its name). Remember, statements are instructions that perform some action but do not evaluate to a value. You have already seen statements: assignment statements store a value into a variable (but the statement does not evaluate to anything).</p>
<p>While Python includes many built-in functions, some functions exist in separate programs called modules. <span class='term'>Modules</span> are Python programs that contain additional functions. We use the functions of these modules by bringing them into our programs with the <span class='m'>import</span> statement. In this case, we're importing the module <span class='m'>random</span>.</p>
<p>The <span class='m'>import</span> statement is made up of the <span class='m'>import</span> keyword followed by the module name. Together, the keyword and module name make up the statement. Line 2 then is an <span class='m'>import</span> statement that imports the module named <span class='m'>random</span> which contains several functions related to random numbers. (We'll use one of these functions later to have the computer come up with a random number for us to guess.)</p>
<div class='sourcecode'><ol start='4'>
<li>guessesTaken = 0</li>
</ol></div>
<p>This line creates a new variable named <span class='m'>guessesTaken</span>. We'll store the number of guesses the player makes in this variable. Since the player hasn't made any guesses so far, we store the integer <span class='m'>0</span> here.</p>
<div class='sourcecode'><ol start='6'>
<li>print('Hello! What is your name?')</li>
<li>myName = <span class='m'>input()</span></li>
</ol></div>
<p>Lines 6 and 7 are the same as the lines in the Hello World program that we saw in Chapter 3. Programmers often reuse code from their other programs when they need the program to do something that they've already coded before.</p>
<p>Line 6 is a function call to the <span class='m'>print()</span> function. Remember that a function is like a mini-program that our program runs, and when our program calls a function it runs this mini-program. The code inside the <span class='m'>print()</span> function displays the string you passed it inside the parentheses on the screen.</p>
<p>When these two lines finish executing, the string that is the player's name will be stored in the <span class='m'>myName</span> variable. (Remember, the string might not really be the player's name. It's just whatever string the player typed in. Computers are dumb and just follow their programs no matter what.)</p>
<h2 id="TherandomrandintFunction">The <span class='m'>random.randint()</span> Function</h2>
<div class='sourcecode'><ol start='9'>
<li>number = random.randint(1, 20)</li>
</ol></div>
<p>In Line 9 we call a new function named <span class='m'>randint()</span>, and then store the return value in a variable named <span class='m'>number</span>. Remember that function calls are expressions because they evaluate to a value. We call this value the function call's return value.</p>
<p>Because the <span class='m'>randint()</span> function is provided by the <span class='m'>random</span> module, we precede it with <span class='m'>random.</span> (don't forget the period!) to tell our program that the function <span class='m'>randint()</span> is in the random module.</p>
<p>The <span class='m'>randint()</span> function will return a random integer between (and including) the two integers we give it. Here, we give it the integers <span class='m'>1</span> and <span class='m'>20</span> between the parentheses that follow the function name (separated by a comma). The random integer that <span class='m'>randint()</span> returns is stored in a variable named <span class='m'>number</span>; this is the secret number the player is trying to guess.</p>
<p>Just for a moment, go back to the interactive shell and enter <span class='m'>import random</span> to import the random module. Then enter <span class='m'>random.randint(1, 20)</span> to see what the function call evaluates to. It should return an integer between <span class='m'>1</span> and <span class='m'>20</span>. Now enter the same code again and the function call will probably return a different integer. This is because each time the <span class='m'>randint()</span> function is called, it returns some random number, just like when you roll dice you will get a random number each time.</p>
<div class='sourceblurb'>
>>> import random<br />
>>> random.randint(1, 20)<br />
12<br />
>>> random.randint(1, 20)<br />
18<br />
>>> random.randint(1, 20)<br />
3<br />
>>> random.randint(1, 20)<br />
18<br />
>>> random.randint(1, 20)<br />
7<br />
>>><br />
</div>
<p>Whenever we want to add randomness to our games, we can use the <span class='m'>randint()</span> function. And we use randomness in most games. (Think of how many board games use dice.)</p>
<p>You can also try out different ranges of numbers by changing the arguments. For example, enter <span class='m'>random.randint(1, 4)</span> to only get integers between <span class='m'>1</span> and <span class='m'>4</span> (including both <span class='m'>1</span> and <span class='m'>4</span>). Or try <span class='m'>random.randint(1000, 2000)</span> to get integers between <span class='m'>1000</span> and <span class='m'>2000</span>. Below is an example of calling the <span class='m'>random.randint()</span> function and seeing what values it returns. The results you get when you call the <span class='m'>random.randint()</span> function will probably be different (it is random, after all).</p>
<div class='sourceblurb'>
>>> random.randint(1, 4)<br />
3<br />
>>> random.randint(1, 4)<br />
4<br />
>>> random.randint(1000, 2000)<br />
1294<br />
>>> random.randint(1000, 2000)<br />
1585<br />
>>><br />
</div>
<p>We can change the game's code slightly to make the game behave differently. Try changing line 9 and 10 from this:</p>
<div class='sourcecode'><ol start='9'>
<li>number = random.randint(1, <b>20</b>)</li>
<li>print('Well, ' + name + ', I am thinking of a number between 1 and <b>20</b>.')</li>
</ol></div>
<p>into these lines:</p>
<div class='sourcecode'><ol start='9'>
<li>number = random.randint(1, <b>100</b>)</li>
<li>print('Well, ' + name + ', I am thinking of a number between 1 and <b>100</b>.')</li>
</ol></div>
<p>And now the computer will think of an integer between <span class='m'>1</span> and <span class='m'>100</span>. Changing line 9 will change the range of the random number, but remember to change line 10 so that the game also tells the player the new range instead of the old one.</p>
<h3 id="CallingFunctionsthatareInsideModules">Calling Functions that are Inside Modules</h3>
<p>By the way, be sure to enter <span class='m'>random.randint(1, 20)</span> and not just <span class='m'>randint(1, 20)</span>, or the computer will not know to look in the <span class='m'>random</span> module for the <span class='m'>randint()</span> function and you'll get an error like this:</p>
<div class='sourceblurb'>
>>> randint(1, 20)<br />
Traceback (most recent call last):<br />
File "<stdin>", line 1, in <module><br />
NameError: name 'randint' is not defined<br />
>>><br />
</div>
<p>Remember, your program needs to run <span class='m'>import random</span> before it can call the <span class='m'>random.randint()</span> function. This is why <span class='m'>import</span> statements usually go at the beginning of the program.</p>
<h2 id="PassingArgumentstoFunctions">Passing Arguments to Functions</h2>
<p>The integer values between the parentheses in the <span class='m'>random.randint(1, 20)</span> function call are called arguments. <span class='term'>Arguments</span> are the values that are passed to a function when the function is called. Arguments tell the function how to behave. Just like the player's input changes how our program behaves, arguments are inputs for functions.</p>
<p>Some functions require that you pass them values when you call them. For example, look at these function calls:</p>
<div class='sourceblurb'>
input()<br />
print('Hello')<br />
random.randint(1, 20)<br />
</div>
<p>The <span class='m'>input()</span> function has no arguments but the <span class='m'>print()</span> function call has one and the randint() function call has two. When we have more than one argument, we separate each with commas, as you can see in this example. Programmers say that the arguments are <span class='term'>delimited</span> (that is, separated) by commas. This is how the computer knows where one value ends and another begins.</p>
<p>If you pass too many or too few arguments in a function call, Python will display an error message, as you can see below. In this example, we first called <span class='m'>randint()</span> with only one argument (too few), and then we called <span class='m'>randint()</span> with three arguments (too many).</p>
<div class='sourceblurb'>
>>> random.randint(1)<br />
Traceback (most recent call last):<br />
File "<pyshell#1>", line 1, in <module><br />
random.randint(1)<br />
TypeError: randint() takes exactly 3 positional arguments (2 given)<br />
>>> random.randint(1, 2, 3)<br />
Traceback (most recent call last):<br />
File "<pyshell#2>", line 1, in <module><br />
random.randint(1, 2, 3)<br />
TypeError: randint() takes exactly 3 positional arguments (4 given)<br />
>>><br />
</div>
<p>Notice that the error message says we passed 2 and 4 arguments instead of 1 and 3. This is because Python always passes an extra, invisible argument. This argument is beyond the scope of this book, and you don't have to worry about it.</p>
<h2 id="WelcomingthePlayer">Welcoming the Player</h2>
<p>Lines 10 and 12 greets the player and tells them about the game, and then starts letting the player guess the secret number. Line 10 is fairly simple, but line 12 introduces a useful concept called a loop.</p>
<div class='sourcecode'><ol start='10'>
<li>print('Well, ' + myName + ', I am thinking of a number between 1 and 20.')</li>
</ol></div>
<p>In Line 10 the <span class='m'>print()</span> function welcomes the player by name, and tells them that the computer is thinking of a random number.</p>
<p>But wait - didn't I say that the <span class='m'>print()</span> function takes only one string? It may look like there's more than one string there. But look at the line carefully. The plus signs concatenate the three strings to evaluate down to one string, and that is the one string the <span class='m'>print()</span> function prints. It might look like the commas are separating the strings, but if you look closely you see that the commas are <i>inside</i> the quotes, and part of the strings themselves.</p>
<h2 id="Loops">Loops</h2>
<p>Line 12 has something called a <span class='m'>while</span> statement, which indicates the beginning of a while loop. <span class='term'>Loops</span> are parts of code that are executed over and over again. But before we can learn about <span class='m'>while</span> loops, we need to learn a few other concepts first. Those concepts are blocks, Booleans, comparison operators, conditions, and finally, the <span class='m'>while</span> statement.</p>
<h2 id="Blocks">Blocks</h2>
<p>A <span class='term'>block</span> is one or more lines of code grouped together with the same minimum amount of indentation. You can tell where a block begins and ends by looking at the line's <span class='term'>indentation</span> (that is, the number of spaces in front of the line).</p>
<p> A block begins when a line is indented by four spaces. Any following line that is also indented by four spaces is part of the block. A block within a block begins when a line is indented with another four spaces (for a total of eight spaces in front of the line). The block ends when there is a line of code with the same indentation before the block started.</p>
<p>Below is a diagram of the code with the blocks outlined and numbered. The spaces have black squares filled in to make them easier to count.</p>
<p class='centeredImageP'><img src='images/4-1.png' alt='' class='centeredImage' /><br />
Figure 4-1: Blocks and their indentation. The black dots represent spaces.</p>
<p>For example, look at the code in Figure 4-1. The spaces have been replaced with dark squares to make them easier to count. Line 12 has an indentation of zero spaces and is not inside any block. Line 13 has an indentation of four spaces. Since this indentation is larger than the previous line's indentation, we can tell that a new block has started. Lines 14, 15, 17 and 19 also have four spaces for indentation. Both of these lines have the same amount of indentation as the previous line, so we know they are in the same block. (We do not count blank lines when we look for indentation.)</p>
<p>Line 20 has an indentation of eight spaces. Eight spaces is more than four spaces, so we know a new block has started. This is a block that is inside of another block.</p>
<p>Line 22 only has four spaces. The line before line 22 had a larger number of spaces. Because the indentation has decreased, we know that block has ended. Line 22 is in the same block as the other lines with four spaces.</p>
<p>Line 23 increases the indentation to eight spaces, so again a new block has started.</p>
<p>To recap, line 12 is not in any block. Lines 13 to 23 all in one block (marked with the circled 1). Line 20 is in a block in a block (marked with a circled 2). And line 23 is the only line in another block in a block (marked with a circled 3).</p>
<p>When you type code into IDLE, each letter is the same width. You can count the number of letters above or below the line to see how many spaces you have put in front of that line of code.</p>
<p>In this figure, the lines of code inside box 1 are all in the same block, and blocks 2 and 3 are inside block 1. Block 1 is indented with at least four spaces from the left margin, and blocks 2 and 3 are indented eight spaces from the left margin. A block can contain just one line. Notice that blocks 2 and 3 are only one line each.</p>
<h2 id="TheBooleanDataType">The Boolean Data Type</h2>
<p>The Boolean data type has only two values: <span class='m'>True</span> or <span class='m'>False</span>. These values are case-sensitive and they are not string values; in other words, you do <b>not</b> put a ' quote character around them. We will use Boolean values (also called <span class='term'>bools</span>) with comparison operators to form conditions. (Explained next.)</p>
<h2 id="ComparisonOperators">Comparison Operators</h2>
<p>In line 12 of our program, the line of code containing the <span class='m'>while</span> statement:</p>
<div class='sourcecode'><ol start='12'>
<li>while guessesTaken < 6:</li>
</ol></div>
<p>The expression that follows the <span class='m'>while</span> keyword (<span class='m'>guessesTaken < 6</span>) contains two values (the value in the variable <span class='m'>guessesTaken</span>, and the integer value <span class='m'>6</span>) connected by an operator (the <span class='m'><</span> sign, the "less than" sign). The <span class='m'><</span> sign is called a <span class='term'>comparison operator</span>.</p>
<p>The comparison operator is used to compare two values and evaluate to a <span class='m'>True</span> or <span class='m'>False</span> Boolean value. A list of all the comparison operators is in Table 4-1.</p>
<div class='createspace'><br /><br /><br /></div>
<table class='simpletable'>
<caption>Table 4-1: Comparison operators.</caption>
<tr><th class='simpletd'>Operator Sign</th><th class='simpletd'>Operator Name</th></tr>
<tr><td class='simpletd m' align='center'><</td><td class='simpletd'>Less than</td></tr>
<tr><td class='simpletd m' align='center'>></td><td class='simpletd'>Greater than</td></tr>
<tr><td class='simpletd m' align='center'><=</td><td class='simpletd'>Less than or equal to</td></tr>
<tr><td class='simpletd m' align='center'>>=</td><td class='simpletd'>Greater than or equal to</td></tr>
<tr><td class='simpletd m' align='center'>==</td><td class='simpletd'>Equal to</td></tr>
<tr><td class='simpletd m' align='center'>!=</td><td class='simpletd'>Not equal to</td></tr>
</table>
<h2 id="Conditions">Conditions</h2>
<p>A <span class='term'>condition</span> is an expression that combines two values with a comparison operator (such as <span class='m'><</span> or <span class='m'>></span>) and evaluates to a Boolean value. A condition is just another name for an expression that evaluates to <span class='m'>True</span> or <span class='m'>False</span>. You'll find a list of other comparison operators in Table 4-1.</p>
<p>Conditions always evaluate to a Boolean value: either <span class='m'>True</span> or <span class='m'>False</span>. For example, the condition in our code, <span class='m'>guessesTaken < 6</span> asks "is the value stored in <span class='m'>guessesTaken</span> less than the number <span class='m'>6</span>?" If so, then the condition evaluates to <span class='m'>True</span>. If not, the condition evaluates to <span class='m'>False</span>.</p>
<p>In the case of our Guess the Number program, in line 4 we stored the value <span class='m'>0</span> in <span class='m'>guessesTaken</span>. Because <span class='m'>0</span> is less than <span class='m'>6</span>, this condition evaluates to the Boolean value of <span class='m'>True</span>. Remember, a condition is just a name for an expression that uses comparison operators such as <span class='m'><</span> or <span class='m'>!=</span>.</p>
<h2 id="ExperimentwithBooleansComparisonOperatorsandConditions">Experiment with Booleans, Comparison Operators, and Conditions</h2>
<p>Enter the following expressions in the interactive shell to see their Boolean results:</p>
<div class='sourceblurb'>
>>> 0 < 6<br />
True<br />
>>> 6 < 0<br />
False<br />
>>> 50 < 10<br />
False<br />
>>> 10 < 11<br />
True<br />
>>> 10 < 10<br />
False<br />
</div>
<p>The condition <span class='m'>0 < 6</span> returns the Boolean value <span class='m'>True</span> because the number <span class='m'>0</span> is less than the number <span class='m'>6</span>. But because <span class='m'>6</span> is not less than <span class='m'>0</span>, the condition <span class='m'>6 < 0</span> evaluates to <span class='m'>False</span>. <span class='m'>50</span> is not less than <span class='m'>10</span>, so <span class='m'>50 < 10</span> is <span class='m'>False</span>. <span class='m'>10</span> is less than <span class='m'>11</span>, so <span class='m'>10 < 11</span> is <span class='m'>True</span>.</p>
<p>But what about <span class='m'>10 < 10</span>? Why does it evaluate to <span class='m'>False?</span> It is <span class='m'>False</span> because the number <span class='m'>10</span> is not smaller than the number <span class='m'>10</span>. They are exactly the same size. If a girl named Alice was the same height as a boy named Bob, you wouldn't say that Alice is taller than Bob or that Alice is shorter than Bob. Both of those statements would be false.</p>
<p>Try entering some conditions into the shell to see how these comparison operators work:</p>
<div class='sourceblurb'>
>>> 10 == 10<br />
True<br />
>>> 10 == 11<br />
False<br />
>>> 11 == 10<br />
False<br />
>>> 10 != 10<br />
False<br />
>>> 10 != 11<br />
True<br />
>>> 'Hello' == 'Hello'<br />
True<br />
>>> 'Hello' == 'Good bye'<br />
False<br />
>>> 'Hello' == 'HELLO'<br />
False<br />
>>> 'Good bye' != 'Hello'<br />
True<br />
</div>
<p>Notice the difference between the assignment operator (<span class='m'>=</span>) and the "equal to" comparison operator (<span class='m'>==</span>). The equal (<span class='m'>=</span>) sign is used to assign a value to a variable, and the equal to (<span class='m'>==</span>) sign is used in expressions to see whether two values are equal. It's easy to accidentally use one when you meant to use the other, so be careful of what you type in.</p>
<p>Two values that are different data types will <b>always</b> be not equal to each other. For example, try entering the following into the interactive shell:</p>
<div class='sourceblurb'>
>>> 42 == 'Hello'<br />
False<br />
>>> 42 != '42'<br />
False<br />
</div>
<h2 id="LoopingwithWhileStatements">Looping with <span class='m'>while</span> Statements</h2>
<p>The <span class='m'>while</span> statement marks the beginning of a loop. Sometimes in our programs, we want the program to do something over and over again. When the execution reaches a <span class='m'>while</span> statement, it evaluates the condition next to the <span class='m'>while</span> keyword. If the condition evaluates to <span class='m'>True</span>, the execution moves inside the while-block. (In our program, the while-block begins on line 13.) If the condition evaluates to <span class='m'>False</span>, the execution moves all the way past the while-block. (In our program, the first line after the while-block is line 28.)</p>
<p>A <span class='m'>while</span> statement always has a colon (the : sign) after the condition.</p>
<div class='sourcecode'><ol start='12'>
<li>while guessesTaken < 6:</li>
</ol></div>
<p class='centeredImageP'><img src='images/4-2.png' alt='' class='centeredImage' /><br />
Figure 4-2: The <span class='m'>while</span> loop's condition.</p>
<p>Figure 4-2 shows how the execution flows depending on the condition. If the condition evaluates to <span class='m'>True</span> (which it does the first time, because the value of <span class='m'>guessesTaken</span> is <span class='m'>0</span>), execution will enter the while-block at line 13 and keep going down. Once the program reaches the end of the while-block, instead of going down to the next line, it jumps back up to the <span class='m'>while</span> statement's line (line 12). It then re-evaluates the condition, and if it still evaluates to <span class='m'>True</span> we enter the while-block again.</p>
<p>This is how the loop works. As long as the condition is <span class='m'>True</span>, the program keeps executing the code inside the while-block repeatedly until we reach the end of the while-block and the condition is <span class='m'>False</span>. And, until <span class='m'>guessesTaken</span> is equal to or greater than <span class='m'>6</span>, we will keep looping.</p>
<p>Think of the <span class='m'>while</span> statement as saying, "while this condition is true, keep looping through the code in this block".</p>
<p>You can make this game harder or easier by changing the number of guesses the player gets. All you have to do is change this line:</p>
<div class='sourcecode'><ol start='12'>
<li>while guessesTaken < <b>6</b>:</li>
</ol></div>
<p>into this line:</p>
<div class='sourcecode'><ol start='12'>
<li>while guessesTaken < <b>4</b>:</li>
</ol></div>
<p>...and now the player only gets four guesses instead of six guesses. By setting the condition to <span class='m'>guessesTaken < 4</span>, we ensure that the code inside the loop only runs four times instead of six. This makes the game much more difficult. To make the game easier, set the condition to <span class='m'>guessesTaken < 8</span> or <span class='m'>guessesTaken < 10</span>, which will cause the loop to run a few more times than before and accept more guesses from the player.</p>
<p>Of course, if we removed line 17 (<span class='m'>guessesTaken = guessesTaken + 1</span>) altogether then the <span class='m'>guessesTaken</span> would never increase and the condition would always be <span class='m'>True</span>. This would give the player an unlimited number of guesses.</p>
<h2 id="ThePlayerGuesses">The Player Guesses</h2>
<p>Lines 13 to 17 ask the player to guess what the secret number is and lets them enter their guess. We store this guess in a variable, and then convert that string value into an integer value.</p>
<div class='sourcecode'><ol start='13'>
<li> print('Take a guess.') <span class='comment'># There are four spaces in front of print.</span></li>
<li> guess = input()</li>
</ol></div>
<p>The program now asks us for a guess. We type in our guess and that number is stored in a variable named <span class='m'>guess</span>.</p>
<h3 id="ConvertingStringstoIntegerswiththeintFunction">Converting Strings to Integers with the <span class='m'>int()</span> Function</h3>
<div class='sourcecode'><ol start='15'>
<li> guess = int(guess)</li>
</ol></div>
<p>In line 15, we call a new function called <span class='m'>int()</span>. The <span class='m'>int()</span> function takes one argument. The <span class='m'>input()</span> function returned a string of text that player typed. But in our program, we will want an integer, not a string. If the player enters 5 as their guess, the <span class='m'>input()</span> function will return the string value <span class='m'>'5'</span> and not the integer value <span class='m'>5</span>. Remember that Python considers the string <span class='m'>'5'</span> and the integer <span class='m'>5</span> to be different values. So the <span class='m'>int()</span> function will take the string value we give it and return the integer value form of it.</p>
<p>Let's experiment with the <span class='m'>int()</span> function in the interactive shell. Try typing the following:</p>
<div class='sourceblurb'>
>>> int('42')<br />
42<br />
>>> int(42)<br />
42<br />
>>> int('hello')<br />
<br />
Traceback (most recent call last):<br />
File "<pyshell#4>", line 1, in <module><br />
int('forty-two')<br />
ValueError: invalid literal for int() with base 10: 'hello'<br />
>>> int('forty-two')<br />
<br />
Traceback (most recent call last):<br />
File "<pyshell#5>", line 1, in <module><br />
int('forty-two')<br />
ValueError: invalid literal for int() with base 10: 'forty-two'<br />
>>> int(' 42 ')<br />
42<br />
>>> 3 + int('2')<br />
5<br />
</div>
<p>We can see that the <span class='m'>int('42')</span> call will return the integer value <span class='m'>42</span>, and that <span class='m'>int(42)</span> will do the same (though it is kind of pointless to convert an integer to an integer). However, even though you can pass a string to the <span class='m'>int()</span> function, you cannot just pass any string. For example, passing <span class='m'>'hello'</span> to <span class='m'>int()</span> (like we do in the <span class='m'>int('hello')</span> call) will result in an error. The string we pass to <span class='m'>int()</span> must be made up of numbers.</p>
<p>The integer we pass to <span class='m'>int()</span> must also be numerical, rather than text, which is why <span class='m'>int('forty-two')</span> also produces an error. That said, the <span class='m'>int()</span> function is slightly forgiving; if our string has spaces on either side, it will still run without error. This is why the <span class='m'>int(' 42 ')</span> call works.</p>
<p>The <span class='m'>3 + int('2')</span> line shows an expression that adds an integer <span class='m'>3</span> to the return value of <span class='m'>int('2')</span> (which is the integer <span class='m'>2</span>). The expression evaluates to <span class='m'>3 + 2</span>, which then evaluates to 5. So even though we cannot add an integer and a string (<span class='m'>3 + '2'</span> would show us an error), we can add an integer to a string that has been converted to an integer.</p>
<p>Remember, back in our program on line 15 the <span class='m'>guess</span> variable originally held the string value of what the player typed. We will overwrite the string value stored in <span class='m'>guess</span> with the integer value returned by the <span class='m'>int()</span> function. This is because we will later compare the player's guess with the random number the computer came up with. We can only compare two integer values to see if one is greater (that is, higher) or less (that is, lower) than the other. We cannot compare a string value with an integer value to see if one is greater or less than the other, even if that string value is numeric such as <span class='m'>'5'</span>.</p>
<p>In our Guess the Number game, if the player types in something that is not a number, then the function call <span class='m'>int()</span> will result in an error and the program will crash. In the other games in this book, we will add some more code to check for error conditions like this and give the player another chance to enter a correct response.</p>
<p>Notice that calling <span class='m'>int(guess)</span> does not change the value in the <span class='m'>guess</span> variable. The code <span class='m'>int(guess)</span> is an expression that evaluates to the integer value form of the string stored in the guess variable. We must assign this return value to guess in order to change the value in guess to an integer with this full line: <span class='m'>guess = int(guess)</span></p>
<h3 id="IncrementingVariables">Incrementing Variables</h3>
<div class='sourcecode'><ol start='17'>
<li> guessesTaken = guessesTaken + 1</li>
</ol></div>
<p>Once the player has taken a guess, we want to increase the number of guesses that we remember the player taking.</p>
<p>The first time that we enter the loop block, <span class='m'>guessesTaken</span> has the value of <span class='m'>0</span>. Python will take this value and add <span class='m'>1</span> to it. <span class='m'>0 + 1</span> is <span class='m'>1</span>. Then Python will store the new value of <span class='m'>1</span> to <span class='m'>guessesTaken</span>.</p>
<p>Think of line 17 as meaning, "the <span class='m'>guessesTaken</span> variable should be one more than what it already is".</p>
<p>When we add one to an integer value, programmers say they are <span class='term'>incrementing</span> the value (because it is increasing by one). When we subtract one from a value, we are <span class='term'>decrementing</span> the value (because it is decreasing by one). The next time the loop block loops around, <span class='m'>guessesTaken</span> will have the value of <span class='m'>1</span> and will be incremented to the value <span class='m'>2</span>.</p>
<h2 id="ifStatements"><span class='m'>if</span> Statements</h2>
<h3 id="IsthePlayersGuessTooLow">Is the Player's Guess Too Low?</h3>
<p>Lines 19 and 20 check if the number that the player guessed is less than the secret random number that the computer came up with. If so, then we want to tell the player that their guess was too low by printing this message to the screen.</p>
<div class='sourcecode'><ol start='19'>
<li> if guess < number:</li>
<li> print('Your guess is too low.') <span class='comment'># There are eight spaces in front of print.</span></li>
</ol></div>
<p>Line 19 begins an <span class='m'>if</span> statement with the keyword, <span class='m'>if</span>. Next to the <span class='m'>if</span> keyword is the condition. Line 20 starts a new block (you can tell because the indentation has increased from line 19 to line 20.) The block that follows the <span class='m'>if</span> keyword is called an if-block. An <span class='m'>if</span> statement is used if you only want a bit of code to execute if some condition is true. Line 19 has an <span class='m'>if</span> statement with the condition <span class='m'>guess < number</span>. If the condition evaluates to <span class='m'>True</span>, then the code in the if-block is executed. If the condition is <span class='m'>False</span>, then the code in the if-block is skipped.</p>
<p style='float: right;' class='centeredImageP'><img src='images/4-3.png' alt='' class='centeredImage' /><br />
Figure 4-3: if and while statements.</p>
<!-- Made these float left and added <br/><br/> due to a printer issue with IE for CreateSpace. -->
<p style='float: left;'>Like the <span class='m'>while</span> statement, the <span class='m'>if</span> statement also has a keyword, followed by a condition, a colon, and then a block of code. See Figure 4-3 for a comparison of the two statements.<br /><br /></p>
<!-- Made these float left and added <br/><br/> due to a printer issue with IE for CreateSpace. -->
<p style='float: left;'>The <span class='m'>if</span> statement works almost the same way as a <span class='m'>while</span> statement, too. But unlike the while-block, execution does not jump back to the <span class='m'>if</span> statement at the end of the if-block. It just continues on down to the next line. In other words, <span class='m'>if</span> statements won't loop.<br /><br /></p>
<!-- Made these float left and added <br/><br/> due to a printer issue with IE for CreateSpace. -->
<p style='float: left;'>If the condition is <span class='m'>True</span>, then all the lines inside the if-block are executed. The only line inside this if-block on line 19 is a <span class='m'>print()</span> function call.</p>
<span class='createspace'><br /><br /><br /><br /><br /><br /><br /><br /><br /></span>
<p>If the integer the player enters is less than the random integer the computer thought up, the program displays <span class='m'>Your guess is too low</span>. If the integer the player enters is equal to or larger than the random integer (in which case, the condition next to the <span class='m'>if</span> keyword would have been <span class='m'>False</span>), then this block would have been skipped over.</p>
<h3 id="IsthePlayersGuessTooHigh">Is the Player's Guess Too High?</h3>
<p>Lines 22 to 26 in our program check if the player's guess is either too big or exactly equal to the secret number.</p>
<div class='sourcecode'><ol start='22'>
<li> if guess > number:</li>
<li> print('Your guess is too high.')</li>
</ol></div>
<p>If the player's guess is larger than the random integer, we enter the if-block that follows the <span class='m'>if</span> statement. The <span class='m'>print()</span> line tells the player that their guess is too big.</p>
<h2 id="LeavingLoopsEarlywiththebreakStatement">Leaving Loops Early with the <span class='m'>break</span> Statement</h2>
<div class='sourcecode'><ol start='25'>
<li> if guess == number:</li>
<li> break</li>
</ol></div>
<p>This <span class='m'>if</span> statement's condition checks to see if the guess is equal to the random integer. If it is, we enter line 26, the if-block that follows it.</p>
<p>The line inside the if-block is a <span class='term'>break</span> statement that tells the program to immediately jump out of the while-block to the first line after the end of the while-block. (The <span class='m'>break</span> statement does not bother re-checking the <span class='m'>while</span> loop's condition, it just breaks out immediately.)</p>
<p>The <span class='m'>break</span> statement is just the <span class='m'>break</span> keyword by itself, with no condition or colon.</p>
<p>If the player's guess is not equal to the random integer, we do not break out of the while-block, we will reach the bottom of the while-block anyway. Once we reach the bottom of the while-block, the program will loop back to the top and recheck the condition (<span class='m'>guessesTaken < 6</span>). Remember after the <span class='m'>guessesTaken = guessesTaken + 1</span> line of code executed, the new value of <span class='m'>guessesTaken</span> is <span class='m'>1</span>. Because <span class='m'>1</span> is less than <span class='m'>6</span>, we enter the loop again.</p>
<p>If the player keeps guessing too low or too high, the value of <span class='m'>guessesTaken</span> will change to <span class='m'>2</span>, then <span class='m'>3</span>, then <span class='m'>4</span>, then <span class='m'>5</span>, then <span class='m'>6</span>. If the player guessed the number correctly, the condition in the <span class='m'>if guess == number</span> statement would be <span class='m'>True</span>, and we would have executed the <span class='m'>break</span> statement. Otherwise, we keep looping. But when <span class='m'>guessesTaken</span> has the number <span class='m'>6</span> stored, the <span class='m'>while</span> statement's condition is <span class='m'>False</span>, since <span class='m'>6</span> is not less than <span class='m'>6</span>. Because the <span class='m'>while</span> statement's condition is <span class='m'>False</span>, we will not enter the loop and instead jump to the end of the while-block.</p>
<p>The remaining lines of code run when the player has finished guessing (either because the player guessed the correct number, or because the player ran out of guesses). The reason the player exited the previous loop will determine if they win or lose the game, and the program will display the appropriate message on the screen for either case.</p>
<h2 id="CheckifthePlayerWon">Check if the Player Won</h2>
<div class='sourcecode'><ol start='28'>
<li>if guess == number:</li>
</ol></div>
<p>Unlike the code in line 25, this line has no indentation, which means the while-block has ended and this is the first line outside the while-block. When we left the <span class='m'>while</span> block, we did so either because the <span class='m'>while</span> statement's condition was <span class='m'>False</span> (when the player runs out of guesses) or if we executed the <span class='m'>break</span> statement (when the player guesses the number correctly). With line 28, check again to see if the player guessed correctly. If so, we enter the if-block that follows.</p>
<div class='sourcecode'><ol start='29'>
<li> guessesTaken = str(guessesTaken)</li>
<li> print('Good job, ' + myName + '! You guessed my number in ' + guessesTaken + ' guesses!')</li>
</ol></div>
<p>Lines 29 and 30 are inside the if-block. They only execute if the condition in the <span class='m'>if</span> statement on line 28 was <span class='m'>True</span> (that is, if the player correctly guessed the computer's number).</p>
<p>In line 29 we call the new function <span class='m'>str()</span>, which returns the string form of an argument. We use this function because we want to change the integer value in <span class='m'>guessesTaken</span> into its string version because we can only use strings in calls to <span class='m nw'>print()</span>.</p>
<p>Line 29 tells the player that they have won, and how many guesses it took them. Notice in this line that we change the <span class='m'>guessesTaken</span> value into a string because we can only add (that is, concatenate) strings to other strings. If we were to try to add a string to an integer, the Python interpreter would display an error.</p>
<h3 id="CheckifthePlayerLost">Check if the Player Lost</h3>
<div class='sourcecode'><ol start='32'>
<li>if guess != number:</li>
</ol></div>
<p>In Line 32, we use the comparison operator <span class='m'>!=</span> with the <span class='m'>if</span> statement's condition to mean "is not equal to." If the value of the player's guess is lower or higher than (and therefore, not equal to) the number chosen by the computer, then this condition evaluates to <span class='m'>True</span>, and we enter the block that follows this <span class='m'>if</span> statement on line 33.</p>
<p>Lines 33 and 34 are inside the if-block, and only execute if the condition is <span class='m'>True</span>.</p>
<div class='sourcecode'><ol start='33'>
<li> number = str(number)</li>
<li> print('Nope. The number I was thinking of was ' + number)</li>
</ol></div>
<p>In this block, we tell the player what the number is because they failed to guess correctly. But first we have to store the string version of <span class='m'>number</span> as the new value of <span class='m'>number</span>.</p>
<p>This line is also inside the if-block, and only executes if the condition was <span class='m'>True</span>. At this point, we have reached the end of the code, and the program terminates.</p>
<p>Congratulations! We've just programmed our first real game!</p>
<h2 id="SummaryWhatExactlyisProgramming">Summary: What Exactly is Programming?</h2>
<p>If someone asked you, "What exactly is programming anyway?" what could you say to them? Programming is just the action of writing code for programs, that is, creating programs that can be executed by a computer.</p>
<p>"But what exactly is a program?" When you see someone using a computer program (for example, playing our Guess The Number game), all you see is some text appearing on the screen. The program decides what exact text to show on the screen (which is called the <span class='term'>output</span>), based on its instructions (that is, the program) and on the text that the player typed on the keyboard (which is called the <span class='term'>input</span>). The program has very specific instructions on what text to show the user. A <span class='term'>program</span> is just a collection of instructions.</p>
<p>"What kind of instructions?" There are only a few different kinds of instructions, really.</p>
<ol>
<li>Expressions, which are made up of values connected by operators. Expressions are all evaluated down to a single value, like <span class='m'>2 + 2</span> evaluates to <span class='m'>4</span> or <span class='m'>'Hello' + ' ' + 'World'</span> evaluates to <span class='m'>'Hello World'</span>. Function calls are also part of expressions because they evaluate to a single value themselves, and this value can be connected by operators to other values. When expressions are next to the <span class='m'>if</span> and <span class='m'>while</span> keywords, we also call them conditions.</li>
<li>Assignment statements, which simply store values in variables so we can remember the values later in our program.</li>
<li><span class='m'>if</span>, <span class='m'>while</span> and <span class='m'>break</span> are <span class='term'>flow control statements</span> because they decide which instructions are executed. The normal flow of execution for a program is to start at the top and execute each instruction going down one by one. But these flow control statements can cause the flow to skip instructions, loop over instructions, or break out of loops. Function calls also change the flow of execution by jumping to the start of a function.</li>
<li>The <span class='m'>print()</span> function, which displays text on the screen. Also, the <span class='m'>input()</span> function can get text from the user through the keyboard. This is called <span class='term'>I/O</span> (pronounced like the letters, "eye-oh"), because it deals with the input and output of the program.</li>
</ol>
<p>And that's it, just those four things. Of course, there are many details about those four types of instructions. In this book you will learn about new data types and operators, new flow control statements besides <span class='m'>if</span>, <span class='m'>while</span> and <span class='m'>break</span>, and several new functions. There are also different types of I/O (input from the mouse, and outputting sound and graphics and pictures instead of just text.)</p>
<p>For the person using your programs, they really only care about that last type, I/O. The user types on the keyboard and then sees things on the screen or hears things from the speakers. But for the computer to figure out what sights to show and what sounds to play, it needs a program, and programs are just a bunch of instructions that you, the programmer, have written.</p>
<h2 id="AWebPageforProgramTracing">A Web Page for Program Tracing</h2>
<p>If you have access to the Internet and a web browser, you can go to this book's website at <a href='http://inventwithpython.com/traces'>http://inventwithpython.com/traces</a> you will find a page that traces through each of the programs in this book. By following along with the trace line by line, it might become more clear what the Guess the Number program does. This website just shows a simulation of what happens when the program is run. No actual code is really being executed.</p>
<p class='centeredImageP createspace'><img width='570' height='388' src='images/4-4.png' alt='' class='centeredImage' /><br />
Figure 4-4: The tracing web page.</p>
<p class='centeredImageP noncreatespace'><img src='images/4-4.png' alt='' class='centeredImage' /><br />
Figure 4-4: The tracing web page.</p>
<p>The left side of the web page shows the source code, and the highlighted line is the line of code that is about to be executed. You execute this line and move to the next line by clicking the "Next" button. You can also go back a step by clicking the "Previous" button, or jump directly to a step by typing it in the white box and clicking the "Jump" button.</p>
<p>On the right side of the web page, there are three sections. The "Current variable values" section shows you each variable that has been assigned a value, along with the value itself. The "Notes" section will give you a hint about what is happening on the highlighted line. The "Program output" section shows the output from the program, and the input that is sent to the program. (This web page automatically enters text to the program when the program asks.)</p>
<p>So go to each of these web pages and click the "Next" and "Previous" buttons to trace through the program like we did above.</p>
<p>A video tutorial of how to use the online tracing tool is available from this book's website at <a href='http://inventwithpython.com/videos/'>http://inventwithpython.com/videos/</a>.</p>
<table border='0' width='100%'><tr><td><a href='chapter3.html'>Go to Chapter 3 - Strings</a></td><td align='right'><a href='chapter5.html'>Go to Chapter 5 - Jokes</a></td></tr></table>
<div style='height: 310px;'><a href='http://www.amazon.com/Invent-Your-Computer-Games-Python/dp/0982106017/'><img src='images/buyad.png' align='right'></a></div>
</body>
</html>