Archive | April 2016

Arrays in Middle School #csk8

How do you give instructions to pull a random book off a shelf? Or to sort all of your books in alphabetical order? Or to remove the books off your shelf that were written before 1960 and order the rest by date? Or figure out the average length or Lexile level of all the books you have on the shelf?
If you have ever considered problems like these, a computer program can help you and you need to use data structures.

In Computer Science, since I started the semester right away with coding AND I have a very sharp class this semester, we have actually gotten to data structures – the kids are learning about arrays. I mostly learned about arrays in college, so teaching it to middle schoolers is still something I’m new at. I am spreading the instruction out over about a week and a half.

I started by addressing the need for arrays, by having the kids modify a little fortune-teller. The starter code is here.

Fortune Teller Starter

The fortune teller uses three variables to store different fortunes, and then picks a random number. Then it uses a series of if/else statements to choose which fortune is displayed. Pretty simple. I asked the kids to add a new fortune to it and tell me in how many places they had to change the code. The kids did, and the consensus was that it needed three changes: add a new variable, modify the random number generator, and add one more else/if clause.

So then I led them through a short explanations of arrays. You have one variable and it contains an indexed list of data instead of just one data item. The first item is always item 0, then item 1 and so on. This indexed list is called an array. It’s like the arrays they worked with in math class to multiply. You can make arrays that are two-dimensional or more, but this one is just one-dimensional for the list of fortunes.

We modify the program so it looks like this.

Array Fortune Teller

I asked the kids if they would prefer me to go over the instructions live or let them watch a video. Almost the whole class preferred live instruction, which surprised me. I made this nice instructional video but then didn’t use it.

Instructional video: Using an array in the fortune teller

With the new code, adding a new item to the list of fortunes requires only one change to one line of code. Much simpler to make changes! But a little trickier to code.

In the next lesson, we look at how to use a loop with an array to do something simple, like print the contents of an array to the screen. This is also a mainly teacher-led demo, but I did make a nice instructional video that again I didn’t use.

I start with this code:

Print an Array Starter

And then I had this video, which we didn’t use:

Video for looping to print an array

I feel that when you start getting into data structures, that’s where interesting algorithmic work with computers really starts. I decided to have the kids do a little algorithmic role-play to see how they would make a computer work with an array.

I lined up a row of kids at the front of the board and told them to all write down a number on a card, but keep the number hidden.

An array of data, starting from index 0. Can you write instructions for a robot to find the largest number?

An array of data, starting from index 0. Can you write instructions for a robot to find the largest number?

Then I asked the rest of the class to write a set of instructions that a robot could use to figure out the biggest number on a student’s card.  The kids asked “can’t you just write an instruction to have everyone flip their number over and see which one is the biggest?” I said no, robots really need things written step by step, so start with which kid I should walk to first, and what I should ask them and so on.

I knew I’d have some kids that would absolutely fly with it, and I also knew I’d have some that would have trouble with this concept. I did. However in the discussion, a basic understanding of the algorithm came out:

  1. Look at the first number.

2. Remember it.

3. Look at the next number.

4. Compare this number to the one you remember. If it’s bigger, then throw away the number you are currently remembering and remember this one instead.

5. Repeat steps 3 and 4 until you run out of numbers. The number you’re remembering is the biggest.

Arrays are hard, in which the array itself has a variable name, and then the index in the array can be referenced by another variable.

int p = 2;

This use of a variable is pretty straightforward and only takes a little practice to understand. Kids have been using variables since 5th grade in math class, so they have some background with it.

int [] p = {9, 72, 40, 12, 35, 99, 33};

This is more difficult as the whole array is named “p” and your algorithms require that you reference each number with “p” and its index. But so powerful. You can manage really complicated math once you have a basic understanding of data structures.

Anyway. We coded the “find the biggest number” problem by using a sample program, below.

 

int [] nums = {12, 59, 2, 63, 400, 88};
void setup() 
{
  int num_i_remember; 
  num_i_remember = nums[0];
  for(int i = 0; i < nums.length; i++) 
  { 
    if(nums[i] > num_i_remember) 
    { 
      num_i_remember = nums[i]; 
    } 
  } 
  println("the largest value is " + num_i_remember); 
}

 

The challenge I gave to the kids was to write a teacher tool. Sometimes, teachers have to do creative things with their data. For example, I gave 11 quizzes during a semester. Students convinced me to drop the lowest score and average the other 10.

The pair programming task: given an array of 11 quiz scores, find the lowest score, drop it and average the other 10, then tell me the average.

The kids did a really awesome job and only a couple of pairs got stuck and needed a lot of support. The most common solution was the one like Anoushka’s, below. She modified the code that found the largest number so it found the smallest instead. Then she averaged the rest of the numbers using brute force, but with only 10 numbers it worked just fine.

Anoushka’s Teacher Tool

Some students were able to get how to iterate through the array to find the total, subtract the lowest score, and divide by how many numbers there were. Maya’s solution works no matter how many quizzes I give during the semester.

Maya’s Teacher Tool

 

What’s next? I think we will do some unplugged activities to refresh / review, and then make a project that brings arrays to life by storing information useful to teenagers – like the locations of sprites in a video game! I think we’ll work on an animation with a bunch of images that have x and y coordinates stored in an array. Maybe we’ll think of different structures for the data (one array storing both x and y coordinates? 2 arrays? Dare I introduce multi-dimensional arrays?). Then after that… a mini-project, a little game or interactive animation including all of the things we’ve done so far. Processing is so colorful and interesting, I want to see what the kids can make with it.