Tutorial 8: Functions

Are you feeling funky?

All jokes aside, this is very serious business. Functions are incredibly important tools in programming and it really feels like a level up when you understand them!

Almost every programming language contains lots of functions already, so if you're not sure what they are exactly, the chances are you've used them plenty of times without realising!

What is a Function?

A function is like a mini-program which we can use again and again. There are two kinds of functions. There are built-in functions which already exist, and there are user functions which we create.

You can spot a function very easily because it will have a pair of brackets () after it. These might contain information, or they might be empty.

Perhaps the most simple function which we all know and love is print. We use print() all the time to put words on the screen:

print( "like this!" )

In the print() brackets we put the information the function needs.

For print(), it's quite useless unless we tell it what we want to print! So, we must pass our text to the function.

Arguments

Some functions need more information than just one thing. For example, printAt() needs not only the text you want to appear, but also the position of that text on the screen:

printAt( 0, 0, "message" )

The pieces of information in the brackets separated by commas are called arguments. The printAt() function must have its arguments laid out like this:

printAt( x, y, text )  

Our example of printat( 0, 0, message ) would print the word "message" at x position 0, y position 0.

Are you still with us? Of course you are! Oh, this is easy you say?

Well, let's go a little bit deeper.

A function is really a separate piece of code which a computer has to find and use. When a computer reads {code:print("hello!")} it takes our text "hello!" and passes it to the code it must run to make the words appear on screen.

This is the same for all functions. For example, let's take the box() function.

box( x, y, width, height, colour, fill )

As you can see, the box function's arguments are laid out here. The first two numbers in the brackets are the x and y coordinates for the top left point of the box. Next, the third and fourth numbers will be used as the width and height of the box. Next up we have the colour of the box and the last argument tells the box to be filled in or just an outline.

All of these pieces of information are passed to the box function and are used to put a box on screen!

Empty Brackets

It's important to mention that not all functions need something passed to them. Sometimes they just return something. For example, take the gwidth() or gheight() functions.

Notice the empty brackets in gwidth() and gheight(). We do not need to pass any information to them, but they return a number. That number is the width or height of the screen in pixels.

It might seem a bit strange to have to include empty brackets, but remember, functions always need brackets, whether they need information or not.

User-defined Functions

Still with us?

All of that was just the beginning!

It's very common in coding to need to do the same thing multiple times. This is the perfect time for a user-defined function, which is a fancy way of saying your own custom function.

We can create a custom function to do just about anything. Let's start nice and simple. We want to print the word "Hello" on the screen in blue ink and a specific size.

Without our own function, we might have something like this:

  1. textSize( 50 )  
  2. ink( blue )
  3. print( "Hello!" )
  4. update()

Every time we want to do this, we'll have to use these same 4 lines again and again. Unless we create a function to do it!

   1. function fuzePrint()
   2.     textSize( 50 )
   3.     print( "Hello!" )
   4.     update()
   5. return void

Once we've written the above section of code, we can now simply use fuzePrint() and we'll get the same result each time.

But we could upgrade this function. Let's say we wanted to print any text we like, at any size, with any colour!

By passing some variables to our function, we can do this very easily:

  1. function fuzePrint( text, size, col )
  2.     textSize( size )
  3.     ink( col )
  4.     print( text )
  5.     update()
  6. return void

Now our fuzePrint() function has three arguments (pieces of information in the brackets). In our code, we could now type:

  1. fuzePrint( "Hello!", 50, blue )

When we use this function, the information in the brackets is passed to the fuzePrint() function we created. "Hello!" is stored as a variable called text and used in the print() line. The number 50 is stored as a variable called size and used in the textSize() line, and the colour is stored as a variable called col and used in the ink() line.

We could now use our new fuzePrint() function again and again in our program, and save ourselves a lot of hassle!

Return Void

You might have noticed that strange looking line in the fuzePrint() function we just created.

return void

All functions must return something. Even if that something is technically nothing!

At the end of a function you create, you must specify what you would like it to return.

If your function does not need to return anything, simply write the return void line.

Sometimes we want a function to return something calculated in the function itself. For instance, here's a custom function which converts metres into centimetres:

  1. function metre2cm( number )
  2. return number * 100

Simply put the name of the variable you'd like to return at the end of the function! You can also perform operations here, just like the example above.

Try writing some functions of your own.

See you in the next tutorial!

Functions and Keywords used in this tutorial

box(), circle(), clear(), controls(), for, gWidth(), gHeight(), loop, random(), repeat, update()