Unlimited WordPress themes, graphics, videos & courses! Unlimited asset downloads! From $16.50/m
by
FREELessons:18Length:1.8 hours

Next lesson playing in 5 seconds

Cancel
  • Overview
  • Transcript

2.8 Functions

In this lesson, you’ll learn about functions. You can think of functions as being “subprograms” which can have their own name, can be called anytime, can receive parameters, and can return a value. Let’s learn more.

2.8 Functions

Hello and welcome to lesson number nine where we'll talk about functions. You can think about functions as sub programs that can have their own name, can be called any time, they can receive parameters, and they can also return our values. Now to work with functions, you must first declare you function, and you do that with the keyword function. Then you would give that function a name. So to give you a very simple example, let's say print to console, and then you would open parentheses, and in the parentheses you can specify a list of parameters that they can then pass on to the function. So let's for example say message here, and I'm gonna open a curly brackets, and then inside, you would put the code that's going to be executed by the function. Let's do for example, console log, message, right? So then what I can do is, say print a console, and I can pass in, hello and that's going to print, hello. Of course, this is redundant because console log can already do this, we don't need an extra function for that. But I just wanted to show what you can do with that function. I can also do something like this, I can for example function add, and I can say value one, value two. I can do a console log of val1 plus val2, and in here I can pass for example I can say add, 45 and two, and that's going to print 47 to the console. As I'm saying functions can also return values. So for example instead of doing a console log here, I can simply return one plus two ,and then what I can do is say console log add 45 and two And that's going to print the exact same thing. So I'm basically saying console log. I'm calling this function I'm passing in a 45 and two, and then I need using the valued that the function returns and I'm going to print it to the console so that's how functions work really. It's very very simple. Now functions can also be declared like this. For example let's do the square of a number. So we're going to say square equals function and we're going to pass in number, and then we're simply going to return number multiplied by number. So, for example if we say console log square to this kind of printout for. Now before we wrap things up with functions, I want to talk about something that I mentioned when we talked about variables, and that is a variable scope Back then I said that variable scope means, the context in which that variable is available, and we have global variables, and we have local variables. So now that we've got to functions I think this is a pretty good, time to demonstrate that so for example let's say var X equal three, now this is defined in the global scope. It is not inside any kind of block quote. And that means the variable X is available anywhere. So for example if I say, a function test, and I will simply do a console log of X and then I quote. I mean actually clean this up a little bit here and then I called test that's going to print three. Now, let's say I have another function here, and we're going to hold this test two. And it was the clear a why variable in here, it's going to be equal to five. Well, if I'm going to go into test, and I'm going to say console log Y, it's going to challenge Y is not defined. But if I do the exact same test. In the test2 function, well, let's uncomment this, and let's call. test2 is gonna give me five. So the variable Y is only available in the scope of this function. It's not available anywhere else, like the X variable which is global. Also let's do something like this. We're gonna say var X equals ten. And we're gonna do a console log of X here. And also a console log of X here. So first we're executing test, and we're doing a console log of X and then we're doing a console log of X in the global scope. So now we're if we refresh we have two values, ten and three, even though the variable is called X It has different values in different scopes, the global variables called, has the value of three, and it's only available here and this X valuable has a value of ten. So this console log, actually prints this one not the global one. And that's a very quick introduction to functions. Now as a web designer, probably one of the main things you'll be using JavaScript for is to manipulate the Dong. Or the document object model. Essentially, your web page, the easiest way to do that is with the help of selectors. That's what we'll be learning in the next lesson.

Back to the top