ST EK List:
5.2.1E Program execution automates processes.
5.5.1H Computational methods may use lists and collections to solve problems.

Processing Each Item in a List

Ruthless Suggestions from Al

This project has for each already imported. The page should be clear that students will have to import tools if they want to use for each in their own projects. --MF, 11/15/17
decagon-mandala-ring-and-outline-of-letter-A

In this lab, you will create tools for drawing complex designs from lists of points. To do this, you will use problem decomposition—breaking down the problem into smaller pieces.

On this page, you will create a script that lets you connect the dots (given by a list of points) to draw the letter A.

 

Alphie and Betsy are building a program that will take a list of points (each of which is a list of x and y coordinates) as input and connect the dots. They figure they can use it to draw pictures or graphs of data:

To make a set of starting data, they sketched the letter A on graph paper. They chose a scale that they figured would make their picture a good size on the stage.

ST-Many NYC teachers were confused and thought they are creating the list A themselves whereas we give it to them in the starter file.
Letter A drawn of graph paper with corner coordinatesCorner coordinates (-50, 20) (-10,120), ... (-30,20)
Then they listed the coordinates of each vertex, starting at the arrow and going clockwise around the figure. The first point is at (-50, 20), the second is (-10, 120), and so on. Then they built that list in Snap! like this:
coordinate-list-for-A
Now they need a script that will use that list to make the drawing, like this:
sprite drawing letter A by going to each set of coordinates

Betsy: This list of coordinates outlines an A, so let's name it A.

Betsy clicks Make a variable, names it A, and builds set A to {{-50,20}, {-10,120}, {10,120}, {50,20}, {30,20}, {20,50}, {-20,50}, {-30,20}}.

Then she clicks that set block to run it.

Alphie: So, for each of those eight points, we want the sprite to move to it. Hmmm... go to x:() y:() won't work, because it needs two separate inputs. We need a block that takes one input, a point like list(-50)(20).
Betsy: So we'll make a new block. Let's call it go to point. It'll work like this go to point (list (-50) (20)). We'll use go to x:() y:() or glide (.5) secs to x:() y:() inside it, but we'll have to process the input, list(-50)(20), to supply x: and y: separately. Hmmm...
Gamal: Oh! I know how! I bet we can use item()of(list). Give it a number as its first input. I bet that the rectangle with two smaller orange rectangles inside just says that it expects a list as its second input.
Alphie: I wonder if we can make our go to point block show that it expects a list as input....

Yes, you can make your blocks show what type of data they expect as inputs: a number, a list, or some other type. Some languages require the data type to be indicated. In Snap! it's an option. It's not necessary but, like assigning a color to a block, it can be a helpful reminder of what the block does and what type of input it expects. You've already seen input slots of several shapes, indicating different expected data types.

Notice in the video that there are many input types you can specify (Text, Number, Boolean, etc.) The list input type is chosen because a point is a list of two coordinates.
Input types, list type selected
  1. Click here to load this file. Then save it to your Snap! account.
    It contains the list of points, but you need to build their go to point (point) block with list type input named point block.

    2. Specifying an Input Type

    This animation shows you how to specify the list input type. Other input types are specified the same way. list input type: rectangle with two smaller orange rectangles inside
    List input type selection
    After creating the title and naming the input,
    • Click on the arrow to the right of the input name:
      create input name right arrow
    • Choose the data type you want for that input.
    • Click OK.
  2. Finish building your go to point block and test your block with a few points as input to make sure it does what you want it to.
 
Alphie: Great! Now we can use our go to point block for each of the points in our list.
Betsy: I bet we can use for-each-(item)-of(){}.

Alphie and Betsy design this new script to automate the process of going to each point.

pen down;for each(item) of (A){go to point(item)}

Then they test it out.

Alphie: Yup! for each does exactly what we want. But we have a couple of bugs to fix.
  1. Build and test the script they used.
  2. Fix the two bugs Alphie noticed.
  3. "U2L2-DrawShape"Save your work as U2L2-DrawShape
  4. Think and write:
    • For what purposes might you not want to connect the first and last points?
    • For what purposes might you want to have the pen down only when the sprite marks each point, but never when the sprite moves from one point to another?
    • For what purposes might you prefer go to over glide?
 
  1. Create three new points and a script that draws the complete letter A. You'll have to design a way to indicate in a list of points that they aren't all connected.
    Choose the additional coordinates yourself.
    complete-drawing-of-letter-A

Self-Check: For Each

  1. These questions are similar to those you will see on the AP CSP exam. 
    inputList ← [3, -1, 2, 10, -5]

FOR EACH item IN inputList
{	
  IF ( (item > 0)  AND  (item * item > 4) )
  {
    DISPLAY item
  }
}

    What will be displayed as a result of running the code segment given?
    9, 1, 4, 100, 25
    9, 100
    3, 2, 10
    3, 10
    PROCEDURE Mystery (numberList, targetNumber)
{
  counter ← 0
  FOR EACH number IN numberList
  {
    IF (number > targetNumber)
    {
      counter ← counter + 1
    }
  }
  RETURN (counter)
}
myMathGrades ← [100, 80, 90, 80, 60, 100, 50, 100]
Mystery(myMathGrades, 60)

    What will be returned if the code above is run?
    [100, 80, 90, 80, 100, 100]
    7
    6
    60