5.1: Function Basics - p5.js Tutorial

Timestamps:
0:00 Introduction
1:03 Calling a Function Versus Defining a Function
3:10 Modularity and Reusability
4:42 Code Example
6:30 Syntax of a Function
8:20 Function Naming
9:55 Calling Your Function

Editing by Mathieu Blanchette
Animations by Jason Heglund
Music from Epidemic Sound

#basics #function #p5js #javascript

[FredoCorleone]

If someone is wondering what's the difference between _parameters_ and _arguments_ :

*Parameters are variables declared* within a function definition
_function drawCirle(parameter1, parameter2, ...) {...}_

*Arguments are the values passed* when calling an existing function
_drawCircle(argument1, argument2, ...)_

[FredoCorleone]

A thing is missing here!
*Viewers may wonder why calling functions before their definition works*, the reason is traditional functions are *hoisted*, hoisted means they are raise at the very top of the code by the JavaScript interpreter before running the code.

Another thing: in ES6 there is a *shorthand way of defining functions*, the so called *fat arrow* :

Traditional function:
_function name(parameter1, parameter2, ...) { [Your code here] }_

Fat arrow:
_(parameter1, parameter2, ...) => { [Your code here] }_

*NOTE* :
There are a couple of *differences between traditional functions and fat arrows* :
.1 Traditional functions can use a special keyword _this_ (useful in Object Oriented Programming);
.2 Fat arrow are _not_ hoisted (look line #2 for the hoisted meaning).

[tz]

Shiffman, u are the best dude, have been subscribing to many youtube channels that teach programming, but for the 1st i hit an amazing channel.The way u make programming so fun with a lot of cool examples.

Thanks sir

[MrWardo]

You are the Yoda of P5 and JS! Thanks for doing these videos!

[antonioriz]

Bravo!!!! Each explanation is better that one before, it is like starting to fine tuning to your way the present contents. Great!

[trocandobytes]

Love this tutorial series! And I loved this P5 editor. Only thing I missed was code completion.

[jimmymason]

move() is now a reserved function. Viewers can use moveBall() instead.

[jeffreyrosales]

I like this guy so joyful makes me wanna learn more things.😊😊😊

[Leo-djze]

a quiz today. hope i can do well. have watched this for many times...

[lllvvv]

Thank you so much for the videos! Your skills to explain these processes are awesome!
One quick question:
I do not get the same colors for the different elements of the syntax. Is that customization you did or the P5 editor version?

Cheers!

[whyjustwhy]

wow you are very good at explaining ty for this

[tomato]

why do I love u and your videos so much?

[chrishayes]

I am only now learning but I love how short the videos are

[berylsam]

as the videos on the playlist go on, yuo become more and more serious lol XD !! love your videos anyways and i am still watching the videos in the playlist in sequence !! love your videos !! hopefully, i wish, i will be finishing the playlist tomorrow or day after and i started just yesterday lol <-( that actually did happen and will be for whoever who reads this to figure out what i just said XD )

[nathen]

100th comment, also watching in seqeunce. Thanks, I learned a lot!!

[marcotaurino]

Daniel you are the Doctor who of coding... flibidifloo! p.s. love your work

[gert-janakerboom]

Hi there, when doing this tutorial, i get a message in the console that 'move' is a reserved function for p5. i did not see this pop up in your console, maybe it was added after you made the vid?
anyway, really great tutorials, thanks for putting in so much effort, much appreciated !

[jajuan_brown]

My ball isn't bouncing, although I've put in the same code as you. Any advice?

[beardedjb]

Was there any significant reason in setting yspeed equal to -3 rather than 3 in the ball object? As long as you multiply it by -1 below, it should net the same result, correct? Or was it more like a habit - and if so, is it a good one?

From what I can discern, it just makes the ball start 'upwards' rather than 'downwards'.

[rkkon]

good video. Thank you. You very nice guy