2.7 Functions

Hello everyone and welcome to this course where we'll look at functions in JavaScript. In the category of reference types, you've learned about objects and arrays, now let's look at functions. Functions are one of the most fundamental elements of JavaScript. A function is essentially a set of statements that performs a task or calculates a value. For example, we will declare a function using the keyword "function". Now we need to give it a name, so we'll call it greetings then we need to add parentheses, this is part of the function declaration syntax. Then we add braces. What we have here inside the braces is what we call the body of this function, this is where we add all the instructions to define some kind of logic in our application. For example, the logic of this function is to display a message on the console so we make a console.log We'll add a message: hello everyone. Note now that we have here a statement, so we don't forget the semicolon at the end. But when we declare a function, we don't need to add a ";" because we don't declare it as a variable. This is a function declaration. We're going to call this function like this, we add the name of the function greetings. Again the parentheses, the ";" at the end to indicate that this is a statement. We now have Hello everyone on the console. Now what would we do with that? Let me show you how to make it more interesting. Our functions can have inputs and those inputs can change the behavior of the function. Let's say that instead of displaying "Hello everyone" we want to display the person's name here as "Hello John". So we can add a variable. So we refer to this variable as a parameter, so this greeting function has a parameter called "name" and essentially "name" is like a variable that only has meaning inside this function. Inside this function, we can work with this "name" variable but it will not be accessible outside of this function. The "name" is now an input for this function. Instead of displaying "Hello everyone" you can display hello and then add a + here to concatenate two strings. Now when calling the greeting function, we need to pass a value for the "name" variable or a "name" parameter more precisely. Now we will refer to this as an argument so "John" is an argument to the host function and the "name" is a parameter to the host function, this is one of the things that many programmers know. They don't know the difference between a parameter and an argument. So a parameter is what we have here at the time of declaration but the argument is the actual value of that parameter. We save the changes and we have "Hello John". We can reuse this function but with a different input so we can for example change this line here. And change "John" to "Mary". We have two different messages on the console. A function can have several parameters. Here we can have separate parameters using a comma. So let's add another parameter like "lastName" so on our console log we add a space. Then we display the last name "lastName". When calling this welcome function, we need to pass another argument for "lastName". Let's see what happens if we don't do cala. We save the changes and we get "Hello John undefined". Because as I told you before, the default value of variablse in JavaScript is undefined. So because we haven't passed in any values for "lastName", by default it's not defined. So I'm going to pass another argument here. We separate them using comma. We don't need this second call to the function. When we save the changes, we now have "Hello John Smith". That's it for this little demonstration. See you in the next video on function types in JavaScript.