lesson three: organization chapter 7: functions learning processing daniel shiffman presentation by...
TRANSCRIPT
Lesson Three: Organization
Chapter 7: Functions
Learning Processing
Daniel Shiffman
Presentation by Donald W. SmithGraphics from text
Learning Processing: Slides by Don Smith 2
Lesson Three: Organization
7: FunctionsModularity
Declaring and defining a function
Calling a function
Parameter passing
Returning a value
Reusability
8: Objects
Learning Processing: Slides by Don Smith 3
ModularityWhat is a function?
A named block of codeSometimes called a ‘module’, ‘method’ or a ‘procedure’Some examples that you know are:setup() background()draw() ellipse()mousePressed() rect()
In pseudocode, they might be‘high-level’ headings:Erase backgroundDraw SpaceshipDraw enemiesMove spaceship based on user keyboard commandMove enemies
Learning Processing: Slides by Don Smith 4
Pseudocode to Functions
Each time through draw:Erase backgroundDraw SpaceshipDraw enemiesMove spaceship
Get keyboard commandMove spaceship
Move enemies
Some functions are ‘built-in’You can write your own!
// Modularized draw()void draw() { background(0); drawSpaceShip(); drawEmenies(); moveShip(); moveEnemies();}
Learning Processing: Slides by Don Smith 5
Why use functions?Is your draw()method getting a bit long?
Two key principles of good programming:1) Modularity
Break down code into smaller parts
More manageable and readable
Reduce the number of local variables inside a module
2) ReusabilityDuplicated code (copy/paste?) is not good
Must maintain in multiple places
Better to put duplicate code in a new function and ‘call’ it from multiple places
Exercise 7.1: Modular ‘Pong’ Planning
Learning Processing: Slides by Don Smith 6
What functions might be used in the game of pong?
1) Decide on the ‘rules’One player or two player?
One player example
Two player example
2) Write Pong pseudocode (or flow chart)
3) Decide on function namesFor user-defined functions
4) Think about variables you will needLocal (inside a function) or ‘global’?
Create names you can remember
The Function ‘Definition’Make a named ‘block’ with the following parts:
Return type Function name Parameters area start block
void drawShip ( ) { // Variables and code go here} // end drawShip
This is also called ‘declaring’ the functionYou are ‘telling’ the compiler that there is a new named block of code and how it works
Other Rules:Define function outside all other functions
Name with the same rules as variables (letters, digits, _)
Do not use ‘reserved’ words or already used names
Learning Processing: Slides by Don Smith 7
Calling a FunctionNow that we have a function, let’s use it:void draw() {
drawShip(); // note the semicolon!
}
You ‘Call’ functions from ‘inside’ other functionsIn this case, inside draw()
You call functions by using the function name:Return type Function name Arguments area semicolon
<empty> drawShip ( ) ;
Learning Processing: Slides by Don Smith 8
Exercise 7-2: Write and call a functionDisplay a multi-part graphic (or a Zoog!)
Learning Processing: Slides by Don Smith 9
Bouncing Ball without FunctionsGroup code into related ‘chunks’
Learning Processing: Slides by Don Smith 10
Bouncing Ball with FunctionsName the ‘chunks’, declare functions, call them!
Learning Processing: Slides by Don Smith 11
Functions with Arguments and Parameters What if you wanted to use a function to do slightly different things?
Some examples you have seen that pass arguments to functions include:size(200,200);
color(100,150,0);
ellipse(x, y, width, height);
More?
What if you wanted to write your own function that receives parameters?
Learning Processing: Slides by Don Smith 12
Arguments and ParametersWikipedia Reference:
http://en.wikipedia.org/wiki/Parameter_(computer_science)
The book (and many professionals) confuse the two words.
Per most texts and Wikipedia:Arguments are ‘sent’
Parameters are ‘received’
Learning Processing: Slides by Don Smith 13
// drawBlackCircle receives size parametervoid drawBlackCircle(int diameter) { fill(0); // passes arguments to ellipse() ellipse(50, 50, diameter, diameter);}
Argument comes before Parameter
Multiple Arguments
Learning Processing: Slides by Don Smith 14
void draw() { background(0); // Pass drawCar four arguments drawCar( 100,100,64, color(200,200,0) ); drawCar( 50 ,75 ,32, color(0,200,100) ); drawCar( 80 ,175,40, color(200,0,0) );}
// drawCar receives four parametersvoid drawCar(int x, int y, int thesize, color c) { // Using a local variable "offset" int offset = thesize/4; // Draw main car body …}
Passing Variables
Learning Processing: Slides by Don Smith 15
void draw() { background(0); int size = 32; // Pass drawCar four arguments drawCar( 100,100,size, color(200,200,0) ); size = size + 16; drawCar( 50 ,75 ,size, color(0,200,100) ); size = size + 16; drawCar( 80 ,175,size, color(200,0,0) );}
// drawCar receives four parametersvoid drawCar(int x, int y, int thesize, color c) { // Using a local variable "offset" int offset = thesize/4; // Draw main car body …}
Keys to Passing ArgumentsYou must pass the same number of arguments as defined in the function parameter list.
When an argument is passed, it must be of the same type as declared within the parameters in the function definition.
An integer must be passed into an integer
a floating point into a floating point..
The value you pass as an argument to a function can be a:Literal value (20, 5, 4.3, etc.),
Variable (x, y, size, etc.)
The result of an expression (8 + 3, 4 * x/2, random(0,10), etc.)
Parameters act as local variables inside the receiving function
They are only accessible within that function
Learning Processing: Slides by Don Smith 16
Exercise 7-5: Write a function definition:
Learning Processing: Slides by Don Smith 17
void draw() { float curHourly = 12.25; float raisePct = 9.0; showNewHourly(curHourly, raisePct);}
Write your own showNewHourly()function definition to match the function call
// Make a comment line above the name// return type function name ( parameters ) { // Indented code goes here // Print the new hourly rate}
Exercise 7-6: Bouncing Car
Learning Processing: Slides by Don Smith 18
int globalX = 0;int globalY = 100;int speed = 1;
void draw() {background(0); // Call move // Call bounce // Call drawCar with global X and Y and other params;}
Write your own function calls to match the functions move, bounce and drawCar
What am I really passing?Can the receiving function change the variable that you pass?
That might be… dangerous…
Here are the rules in Processing and Java:All primitive types (int, float, double, char…) are passed by copying the contents of the variable inside the argument into the new parameter variable.
Learning Processing: Slides by Don Smith 19
20
Pass by Value (Animated)
Let's take a closer look at how this works.
void draw() {int n = 10;
println(n);byValue(n);
println(n);} // end draw()
void byValue(int num) {
num = 73;println(n);
} // end byValue()
RAM
10 n
num10 10
73
Wuzzit Do?
Learning Processing: Slides by Don Smith 21
Return types
Up until now, you have used a mysterious keyword named void before all of your functions
void setup() {
void draw() {
void byValue(int num) {
void drawCar(int x, int y, int thesize, color c) {
Remember the parts of a function definition?Return type Function name Parameters area start blockvoid drawShip ( ) {
Here is an example that ‘return’ an int:int sum(int a, int b, int c) {
int total = a + b + c;
return total; // Return a copy of a local variable
}
Learning Processing: Slides by Don Smith 22
Assigning the return value to a variable
void draw() {
int answer;
answer = sum( 17, 42, 52);
println(answer);
noLoop();
}
int sum(int a, int b, int c) {
int total = a + b + c;
return total;
}Learning Processing: Slides by Don Smith 23
draw calls sum with arguments
sum receives values into parameters
sum method calculates local total
sum method returns copy of total
draw assigns returned val to answer
A useful example: Distance between 2 pts
Learning Processing: Slides by Don Smith 24
float distance(float x1, float y1, float x2, float y2) {
float dx = x1 – x2; // one side of the right triangle
float dy = y1 – y2; // other side of the right triangle
float d = sqrt(dx*dx + dy*dy); // hypoteneuse length
return d;
}
Processing has a dist()function that does the same thing…
Learning Processing: Slides by Don Smith 25
SummaryFunctions are useful for many tasks
1) Break code into smaller ‘named’ chunks2) Prevent duplication of code3) Make useful ‘utilities’ that can be reused
Processing is really a ‘function library’Provides functions such as line(), ellipse(), rect()You can write code inside functions that Processing calls
setup() and draw()
You can define your own functionsPass ‘arguments’ to functions to tell them what to do
They are received as ‘parameters’Primitive types are passed by value
Functions can return values