Creators – Arrays and Classes

Several Values in One Place

This week we looked at two very useful concepts in JavaScript, Arrays (we’ve also called them lists) and Classes (we’ve also called them objects). They are both things that allow one variable to store more than one value at at time. This can often be very convenient and has the potential to save us a lot of typing! Who doesn’t like that?

Arrays

A plain variable in JavaScript can store a single value, we’ve seen that loads of times:

let a = 5;
let b = 7;
let c = a + b; // will be 5 + 7 = 12

An array variable in JavaScript can store more than one value, just by putting them in square brackets and separating them with commas:

let a = [5, 7]
let c = a[0] + a[1]; // This is the same as above!

The code here does the exactly the same thing as the block above it. See that a now has two values in it and we use a[0] to get the first value and a[1] to get the second. This technique isn’t super useful when we only have two values, but the more we have to store, the more useful this gets. Imagine if we had 10 values,  how much shorter would the array version be?

You can also create an empty array and put values in it later:

let a = [];
a.push(5);
a.push(7);

In the code above we create an empty array (nothing between the square brackets) and then use the push() function to add two values into it.

Concept of Classes

A class is a programming concept that lets you define objects which contain both Properties and Methods. Properties are values associated with the object. Methods are actions that we can ask the object to perform.

class

Think of yourself as a Person object and imagine some of the Properties and Methods you might have.

Your Properties might include NameAgeHeightWeight, etc. A simple Method you might have could be SayHi(). That would make you say “Hi, it’s <Name>!”.

A method might have arguments, so it could be SayHiTo(“Dave”) which would make you say “Hi Dave!”.

Classes in JavaScript

Making classes in JavaScript is pretty easy. Let’s look at the Person class we showed above:

class Person{
  constructor(name, age, height, weight){
   this.Name = name; 
   this.Age = age; 
   this.Height = height; 
   this.Weight = weight;
  }
  
  SayHi(){
    Console.Log("Hi, it's " + this.Name + "!");
  }

  SayHi(who){
     Console.Log("Hi " + who + "!" );
  }
}

We say “class“, the name of the class and a pair of curly brackets. Inside these brackets we have three functions (but notice we don’t have to say “function“).

Let’s look at the first of these, called constructor(). This is where we set the class properties. Note that we must put “this.” before properties to distinguish them.

The second two functions, SayHi() and SayHiTo() aren’t too usual, again note that we must use “this.Name” to get the value of the name property.

Download

This week we created a class to represent a bouncing ball and we saw how easy it was, once we’d created the class, to make several of them, all bouncing around simultaneously. This would have taken us a lot more code to do if we hadn’t made a class. As always, the files can be downloaded from our Github page.

 

 

 

 

 

 

Week 7 2017 – Explorers – Piano

Hello everyone,

Thank you all for coming again this week and I hope you enjoyed the Halloween break.

This week we did a simple Piano.

piano

We only had to draw two keys, and then could duplicate these and change the names. The same applied to the code. The code is the same for each key apart from one small change so the note is the appropriate for the key.

REMEMBER! You need to make four changes each time you duplicate:

Change the name of the spite to the next Note

Change the name of the TWO costumes

Change the NOTE played

Piano2

Piano3

 

Here are notes from this week in PDF CDA-S6-Week_07-Piano.pdf

Martha

Creators – Random Pin Placement

This week we worked on random pin placement for our game. We updated the existing PinManager component to randomly (as opposed to regularly) place a number of pins into the scene.

Arrays

An array is a way for a variable to hold more than one value. It’s a a very useful concept in programming; complex programs would be practically impossible without them. In C# arrays are declared as follows:

     int[] nums = new int[4];
     bool[,] grid = new bool[rows, cols];

The first line creates a one-dimensional array called nums which has four entries: nums[0], nums[1], nums[2] and nums[3].

The second line creates a two-dimensional array called grid. Note the size in this case depends on the values of the variables rows and cols. The first entry is grid[0,0] and the last is grid[rows – 1, cols – 1]. The total number of locations in this array is rows * cols.

Continue reading

Beginners Scratch – Week 7 – Breakout

***Next week we will be doing Animation! Please bring any miniature figures that you might want to use to create a short story through stop motion photography. We will also need some way to take photos and download the images to the computer – so parents need to remember a camera and download cables. I will bring a big load of modelling clay.***

Breakout is a variation of our previous game, Paddleball. We create a new scoring experience for our gamers by introducing blocks at the top of our screen that they get points for hitting.

CDA-S5-Challenge_04-Breakout-game view

Everyone already knew how to import or create the first two sprites – the paddle and the ball and most coders remembered from paddleball how to get the paddle to forever follow the mouse in only the x-direction. CDA-S5-Challenge_04-Breakout-paddle control

The code to move the ball was essentially the same as in the paddle ball game with a small change to broadcast the starting position to itself.CDA-S5-Challenge_04-Breakout-ball control 2

We then created two variables, one for the score which will go up when the ball hits a block sprite(can you copy this code from the Paddleball game code and use it in the ball sprite?) and one for lives which will go down every time the ball touches the end line we added under the paddle on the Backdrop. Can you figure out where to put the code to reduce lives by one when the ball touches a certain colour?CDA-S5-Challenge_04-Breakout-variables

Lastly, we created the block sprites and coded for them to fade away when they touched the ball. We use the EFFECT block of code in LOOKS.CDA-S5-Challenge_04-Breakout-brick script

The complete set of notes in .PDF format can be opened here:CDA-S5-Challenge_08_Breakout. You can play with my completed game on the http://scratch.mit.edu webpage. If you sign in as cdathenry1516 and use the password: cdathenry, you will be able to play all our games. If you have your own sign in name, just search for cdathenry1516 and you can see and play them all as well. Please put yours up there as well!CDA-S5-Challenge_04-Breakout-save to website

See you all next week!

Julie

 

 

Week 7 – Scratch Beginners – Christmas Scene-Animation

Hi everyone,

This session we got into the Christmas spirit and we created some animated Christmas Scenes.

CDA-S4-Week_07-ChristmasScene

Using costumes we could have the effect of movement, snow falling, dancing penguin, or flashing lights. We could also use the colour effect code to change colours.

Walking around the room I saw lots of great scenes, some dancing Santas, reindeer with noses that change colour and lots lots more.

Next week is our last week so we are going to have a “Show and Tell” and then some Pizza! If you would like to show us anything you have done so far this year, just let one of the mentors know on Saturday and we will get you up to show everyone. If you would rather not get up in front of the room that is fine, but I would love to see it so make sure to call me over to have a look.

NEXTWEEK

Looking forward to seeing you all there on Saturday. D’ont forget to get into the mood, wear something Christmasy..Jumper, Hat, Scarf, socks, earrings, whatever!

Here are the note from this weeks session. CDA-S4-Week_07-ChristmasScene.pdf

Python Games – Week 7: Collision Detection

Today the Python games group explored one of the most important things used in graphical computer games, collision detection. We also investigated the use of lists and for loops to manipulate sprites in our games. Our demo code is available here.

We are still working on our ocean game and we will add audio next week.

These are my slides from today python session_7

Scratch Beginners – Week 7 – Paint.net

Hello everyone,

Today we took a look at Paint.net, which is a drawing program. I quickly went through the menus but the best way to learn a program like this is to use it and experiment with it.

PAINTNET

The main reason we looked at it this week was because we will need it next week as we begin our modelling and stop/motion animation. After we take our photos we will be able to “clean them up before we bring them into Scratch as our Sprites.

snake

Next week, if the Moms and Dads could bring along a camera or phone along with the lead to attach these to your laptop.

And of course most important of all bring your imagination!

Here the full notes from todays session in PDF form. CDA-S3-Challenge07-LearnAboutPainting.pdf

ModderDojo Athenry Week 7: Learning More about Functions

In recent weeks, we have been writing JavaScript functions to build MineCraft structures using ScriptCraftJS.

Download our mods here: https://cdathenry.wordpress.com/2013/11/10/modderdojo-athenry-our-scriptcraftjs-minecraft-mods/

This week, we spent a bit more time learning about functions, since they are an extremely important part of any programming language. Slides below.

Function Parameters

Default Values for Parameters

Multiple Functions in a Mod (1)

Multiple Functions in a Mod (2)

Helper Functions and Standalone Functions

Why Use Multiple Functions?

Beginners Scratch – Challenge 7 – Buid Your Own Game!

These are the notes from our seventh challenge in Season 2 of Scratch Beginners, CoderDojo Athenry.

The challenge this week was to work on your own game. The coding concepts for this challenge are:

  1. Using the Scratch skills you have acquired for your own games
  2. Creativity and imagination
  3. Designing your own program.

A key point in developing your own game is to start simple, get the first idea tested and working, and then start adding more. We also spoke about the usefulness of planning on paper, rather than jumping straight into coding (which can be a tough one to sell!)

Here are the notes from the day (PDF): CDA-S2-Challenge07-YourGame.pdf

If you want to check how we did things in previous challenges, you can find the programs here: http://scratch.mit.edu/galleries/view/183379

We will continue to work on our own games next week, and I will post a link to a gallery of games that ninjas have produced.