Today: insights about loops, if statement, ==, make-a-drawing, left_clear(), bit puzzles

Reminders

• Please turn off all video-watching, video-ads in class - we're trying to keep the network working inhere
• Putting out HW1a today, all parts due next tue 11:55pm
  LaIr office hours start Sun eve
• Section signup Thu 5pm (link on course page)
• Nick office hours today - after class
• Juliette hours thursday
• In office hours: lecture examples are great to work on
  Like everyone present can watch, not staring at another student's hw code
• We have lots of lecture examples today
  There is a Show Solution button on each problem!
  So if stuck, you can compare your code to the solution yourself

Aside: Bit Controls

• Cmd-Return (Mac) or Ctrl-Return with cursor in code - just Run
  Very handy when pounding away on your code
• Diff marks - red marks on world vs. desired output
• Speed
• Auto Play - uncheck, Run button shows bit at start state, can play from there
• End State - check, instead of animating, just show end state

Words and The Nature of Computing

"The computer does not have any insight, instead following the simple, mechanical instructions written by the programmer."

These are just words, and rather than try to explain them in different ways, I will hope that after you've written 10 Bit programs, you will understand in your bones what those words are trying to say.

Recall: Go-Green

> go-green

Loop - Big Increase in Power

• Loops let the code run a few lines again and again
• A big increase in power
• This code will work for any size world

Move-To Convention, move, then paint

• The go-green loop looks like this inside:
  bit.move()
bit.paint('green')
• This works fine, painting all the squarea except the first square
• The loop operates on each "moved to" square
• We often write the Bit problems to do something to each moved-to square to fit this loop pattern

Other Convention: paint, then move

• Could write the code in the loop like this:
  bit.paint('green')
bit.move()
• This works fine too!
• It paints all the squares except missing the last square
• Demo: try swapping move/paint in go-green, turn off "diff" option

Loop = Always Misses One Square

• We tend to use the move-to convention
• Key: the loop always misses the square at one end
• Don't drive yourself crazy trying to use one loop to hit all the squares
• You need to add a little code before or after the loop for the missing square (see next example!)

All Blue Example

> All-Blue

Specification: Bit starts in the upper left square facing the right side of the world. Move bit forward until blocked. Paint every square bit occupies blue, including the first. When finished, turn bit to face downwards. (Demo - this code is complete. Shows the basic while-loop with front_clear() to move until blocked, and also taking an action before and after the loop.)

all-blue() Code

def all_blue(filename):
    bit = Bit(filename)
    bit.paint('blue')  # 1 paint before the loop
    while bit.front_clear():
        bit.move()
        bit.paint('blue')
    bit.right()  # Turn after the loop

1. Run All Blue Normally, test = go

Watch how it paints every square, turns down at the end. When a problem says "until blocked", you typically use front_clear() as the test. This code uses the move-to convention. In the loop, the code moves forward one square, paints it blue.

Notice that the test of the while is essentially the "go" condition - when that test is true, Bit should move forward. Conversely, when the test is False, don't move.

2. Lines Before/After Loop Different

• Lines before and after the loop to handle the first/last squares (see above)
  bit.paint('blue') - before loop
  bit.right() - after loop
• These lines are outside the loop, run once
• Point: lines inside vs. outside the loop is a big difference
• Indentation controls what's in the loop
• Demo: what if want to paint the last square red?
  Change the last line to bit.paint('red')
  Try indenting it wrong

3. One Code - Many Cases - Generality

• "Generality" - real Math Department word here
• There is one copy of your code algorithm
• There are many different cases it should work on
  Infinitely many cases actually
  Think of all the different sizes and shapes of Bit world
  The while construct is very powerful for generality
• General = it should work for all the different input worlds
• Click the run menu to select different "cases", run against them
• Develop using just one case for testing
• Then use the Run All option as a final test
• Run All gives the Big Green Checkmark
  Final test for each HW problem
  Don't debug with Run All - output is worse, debug with just one case
• I like how generality is kind of ethereal, but with 1-code many-cases .. it's very concrete
• Note: Run-all does not prove the code is correct in an airtight way
  If the code works for run-all it is probably correct, but it's not a 100% proof

4. What Comes After Line 6?

• Run Bit on Case-1, stop it a couple squares from the end
• What comes after Line 6?
• Experiment: Use step button, predict what line comes next before clicking
• What comes after line 4? Varies
• Keep stepping to get to the end of the lop

5. Zero Loops is OK - Edge Cases

Look at Case-3 and then Case-4. Turn off the Auto-Play option, so when you click Run, the world stays at the start, waiting for you to click Step. See how the while test behaves on Case-3 and then Case-4. For Case-4, the while-test is False the very first time! The result is, the loop body lines run zero times. This is fine actually. There were zero squares to move to, so looping zero times is perfect. This is an example of an "edge" case, the smallest possible input. It's nice that the while loop handles this edge case without any extra code.

6. Bad Move Bug - Exception

Let's do something wrong. Change the loop body to have three moves instead of one, which is buggy code. The problem is, this code may move bit into a wall (a not-clear square).

    ...
    while bit.front_clear():
        bit.move()
        bit.move()
        bit.move()
        bit.paint('blue')
    bit.right()

With the correct code, the test checks the one square ahead, and the loop body moves one time, that square (e.g. the go-green loop). In this way, each move is preceded by a test. With three moves - for the second and third moves, we don't know that those squares are clear for a move.

Run the buggy code - bit reaches the right side, but keeps trying to move(). Moving into a wall or black square (i.e. not a clear square) is an error, resulting in an "exception" error message like this and the program halts at that line:

Exception: Bad move, front is not clear, in:all_blue line 6 (Case 1)

If you see an exception like that, your code is doing a move() when the front is not clear. You need to look at your code logic. Normally each move() has a front_clear() check before it, ensuring that the world has space for a move.

Debug Rule 1 - Read the Error Message

First rule of debugging - if there's an error - read the error message and see what line number it is talking about. The error messages can be cryptic, and sometimes they do not help. But very often, the error message is an excellent clue about the problem in the code.

7. Infinite Loop Bugs

Infinite Loops

• Oddball bug case: infinite loop
• The body lines run forever
• The lines never manage to make the while-test False
• May get error message: timed out - possible infinite loop
  The Bit system notices code running for a long time, terminates it
• Click the Bit "stop" button or click on the code to stop the line hilighting

Infinite Loop 1 - Waggle Dance

For a loop to work, each run of the body needs to get closer to being done. With these bugs, bit is not making progress and so it never ends.

Here is a buggy All Blue - instead of move() have bit do right() and the left() - a sort of "waggle dance" like bees do in the hive. Notice that .. bit never moves forward. Bit can do this for eternity, and never leave that first square! Everyone has days like that.

    while bit.front_clear():
        bit.right()    # waggle dance!
        bit.left()
        bit.paint('blue')

Run the code - you will see a message about a timeout, suggesting that this code does not seem to reach an end.

Infinite Loop 2 - move vs. move()

Python syntax requires the parenthesis () to make a function call. Unfortunately, if you omit them, easy enough to do, it does not make a function call. So the code below looks right, but actually it's an infinite loop. Bit never moves. Try it yourself and see, then fix it.

    while bit.front_clear():
        bit.move
        bit.paint('blue')

More Practice

For extra practice, here are some more problems along the lines of All-Blue:

> red2

> Bit Loop

If Statement - Logic

The while-loop is power. If-statement is control, controlling if lines are run or not

If-Statement Demo - Change Blue

We'll run this simple bit of code first, so you can see what it does. Then we'll look at the bits of code that go into it.

Problem statement: Move bit forward until blocked. For each moved-to square, if the square is blue, change it to green. (Demo: this code is complete.).

> Change-Blue Demo

For reference here is the code:

def change_blue(filename):
    bit = Bit(filename)
    while bit.front_clear():
        bit.move()
        if bit.get_color() == 'blue':
            bit.paint('green')

If Statement Syntax

Syntax 4 parts (similar to "while"): if, boolean test-expression, colon, indented body lines

if test-expression:
    body lines

If Statement Operation

• The if-statement evaluates the test expression, looking for True or False
• If the test is True, it runs the body top to bottom
• Otherwise it skips the body, and the run continues after the body
• Basically an On/Off switch - runs the body lines or runs nothing
• There are more complex if forms for later, for now just this is the most common form

Look At Change-Blue Test - Take Apart

Here are the key lines of code:

    ....
    if bit.get_color() == 'blue':
        bit.paint('green')
    ....

1. bit.get_color() Expression

• Code that runs and returns a value to use is an "expression"
  e.g. bit.front_clear() expression - returns True or False
  e.g. bit.get_color() expression - today's example
• bit.get_color() expression returns one of these four:
  'red', 'green', 'blue', None
None returned if the square is not painted
• None is the special Python value meaning "nothing"
  It's handy in computer code to a formal "nothing" value for situations like this

Expression Visualization

Suppose bit is on a squared painted 'green', as shown below. Here is diagram - visualizing that bit.get_color() is called and it's like there's an arrow coming out of it with the returned 'green' to be used by the calling code.

2. == Compares Two Values - Boolean

• The operator == compares two values
  (two equal signs next to each other)
• Returns True if two values are equal, False otherwise
• Very often used in an if-test or a while-test
• if x == 6:
  if-test is True if the variable x is 6

Look at Change-Blue Code Again

Look at the if-statement.

Q: What is the translation of that code into English?

A: For each moved-to square. If the square is blue, paint it green.

while bit.front_clear():
    bit.move()
    if bit.get_color() == 'blue':
        bit.paint('green')

!= Not Equal Form

• Not-equal comparison written with exclamation mark: !=
• if x != 6:
  above is True if x is not 6
• If you want to express "not-equal" in your code, use !=
• Examples below

More Examples == !=

if bit.get_color() == 'red':
    # run this if color is 'red'

if bit.get_color() == None:
    # run this if square is not painted

if bit.get_color() != 'red':
    # run this if square is anything
    # but 'red'
    # e.g. 'green' or 'blue' or None

The Fix Tree Problem

This is a challenging problem for where we are at this point. Just watch (and you can do it in parallel) as I work through the problem. I want to show the thought process and steps to build and debug some code.

Note: it is very common to move bit with an until-blocked loop. This problem is a little unusual, moving bit until hitting a particular color.

> Fix Tree

Before:

After:

Important Ideas - Thinking Drawing and Coding

We have art for these. No expense has been spared!

1. Don't do it in your head

Don't do it just in your head - too much detail. Need to be able to work gradually and carefully.

2. Make a Drawing / Sketch

Draw a typical "before" state - like what do we have to start. The drawings do not need to be fancy, but it's easier to work out the details on a sketch than in your head. Key lesson for today.

3. What is a next-step goal - what do we want?

Look at the before state - what code can advance this?

4. Question: what code?

You have the current state. What code could advance things to the next goal?

Q: Look at those bit positions. When do you want bit to move, and when not to move?

A: Want bit to move when the square is not red. What is the code for that?

Aside: if you were talking to a human, you would just say "make it look like this" and point to the goal. But not with a computer! You need to spell out the concrete steps to make the goal for the computer.

In this, case we're thinking while-loop. Draw in the various spots bit will be in. What is a square where we do not want bit to move? When bit is on the red square. Otherwise bit should move. What does that look like in code?

Code looks like...

while bit.get_color() != 'red':
    bit.move()

5. Try The Code, See What It Does

Ok, run it and see. Sometimes it will not do what we thought.

6. Ok what is the next goal.

Ok what is the next goal? What would be code to advance to that?

I think a reasonable guess here is similar to the first loop, but painting red, like this

while bit.get_color() != 'green':
    bit.move()
    bit.paint('red')

7. OOPS Not What Expected!

OOPS, that code looks reasonable, but does not do what we wanted. The question is: what sequence of actions did the code take to get this output? That's a better question than "why doesn't this work".

Go back to our drawing. Think about the paint/red and the while loop, how they interact.

8. Solution

The problem is that we paint the square red, and then go back to the loop test that is looking for green, which we just obliterated with red. One solution: add an if-statement, only paint blank squares red, otherwise leave the square alone.

This is one solution, which works perfectly..

def fix_tree(filename):
    bit = Bit(filename)
    while bit.get_color() != 'red':
        bit.move()
    bit.left()
    while bit.get_color() != 'green':
        bit.move()
        if bit.get_color() == None:
            bit.paint('red')

Other Solution

Another solution is to change the loop body to do the paint and then the move - that works perfectly too. I slightly prefer the == None solution as it seems more obvious. Both are fine. Very often there are a few different ways to solve something. If we have a strong preference for one form, we will say so, but in this case both are fine.

9. Thinking - Drawing - Coding

Use a drawing to think through the details of what the code is doing. It's tempting to just stare at the code and hit the Run button a lot! That doesn't work! Why is the code doing that?

Or put another way, in office hours, a very common question from the TA would be: can you make a little drawing of the input here, and then look at your line 6, and think about what it's going to do. All the TA does is prompt you to make a drawing and then use that to think about your code.

More Bit Tests: bit.right_clear()

• bit.right_clear() - another Bit function
• Returns True if the square to bit's right is clear, False otherwise
• Same as bit.front_clear() but 90 degrees to the side
• Also have bit.left_clear()

Using not

• Putting not to the left of a True/False value inverts it
• Use not with an if-test or while-test to check for the False condition
  Normally they look for the True condition, but we use not to invert this

if bit.right_clear():
    # run here if right is clear

if not bit.right_clear():
    # run here if right is blocked,
    # aka not-clear

Server: Bit Puzzles

On the experimental server, the Bit Puzzles section has many problems where bit is in some situation and needs to move around using Python code. We'll look at the Coyote problems, and there are many more problems for practice.

Reverse Coyote, remember Test = Go

> reverse-coyote (while + right_clear)

Based on the RoadRunner cartoons, which have a real lightness to them. In the cartoons, the coyote is always running off the side of the cliff and hanging in space for a moment. For this problem, the coyote tries to run back onto the cliff before falling.

Before:

After:

Q: What is the while test for this? Remember that Test = Go. What is the test that is True when we want to move, and False when do not want to move?

A: bit.right_clear()

If We Have Time - You Try

These are all in the "puzzle" section. Reminder: all lecture examples have a Show Solution button if you get stuck.

> standard-coyote

> climb

> encave (a little harder, like a homework prob)