Explained: The basics of Function Parameters & Arguments in Javascript
Disclaimer: I’m currently a beginner in HTML, CSS, and Javascript; whatever I state here is based on the level of knowledge I currently have in Javascript…
What is a Function?
One of the fundamental building blocks in JavaScript programming is a function. It’s a block of code designed to perform a particular task.
Function is a reusable part of software that allows for reusable action in Javascript. They eliminate the need to repeat the same code all the time
You create a data within a function so it can be reused
Function declaration method: you always declare with the keyword “function”
Function Parameters
Function Parameters allow you provide external data to a function. They are things your function needs to work properly.
When you create a function with a parameter, it means you create a function that needs external data to function properly
When you create a function and it has a parameter, whenever you’re calling that function, provide the data that will be passed in the parameter. The Parameter is a pipeline that data passes through
Let’s create a function that can tell us a list of my favourite movies:
The name of this function is favMovie
movie is a placeholder holding the actual movie names.
The favMovie function, specifies the parameter (movie)…The parameter is movie
Now to call the function, and tell it your favourite movie:
function favMovie (movie) {
console.log(`My favourite movie is ${movie}`)
}Arguments:
favMovie(“Pretty Woman”)
favMovie(“The Godfather”)
favMovie(“The Departed”)
When you invoke a function and give it values, that’s an argument. i.e “Pretty Woman”, “The Departed”, “The Godfather” are all Arguments once the function has been called. They’re the real names of your favourite movies that you’re putting into the function.
Get Pixel Lens Design’s stories in your inbox
Join Medium for free to get updates from this writer.
When you run it in the console, it will say:
This means that when the favMovie function is invoked, “My favourite movie is…” this will be logged in the console
Note: We need some data that will be substituted for “movie” and this where you use a string. We use the string as a substitute for the “movie” parameter.
i.e “Pretty Woman”, “The Departed”, “The Godfather are all strings
When you put the name of the movies in a string, it automatically becomes a substitute for the ‘movie’ parameter
Multiple function parameters
When you supply a list of arguments, the arguments are assigned to the parameters in the order specified. In this case, Josh is assigned to man, Summer is assigned to woman
If a function has missing arguments, the arguments are set to undefined
i.e wedding (“Josh”, “Summer”) will log Josh weds Summer
wedding (“Josh”); will log Josh weds undefined
If you have multiple arguments (more arguments than parameter), the console will only log the equal number of parameters to arguments. See example below:
add (4, 6) ;
will give a correct result of 10 when logged
add (4, 9,8,7,6) ;
will ignore (8,7,6) and only add up the first two figures (4, 9), and give a result of 13
Default parameter
This allows you to assign a default value to a parameter if no argument is passed or if the argument is undefined.
To create a default parameter, use the username is the parameter name, and user is the default parameter value
Default parameters are always added to the end of the parameter list, otherwise the function call won’t work properly
Conclusion
- The name of the function is given after the keyword def and before the list of parameters.
- You can call a function multiple times by putting the call in a loop.
- Information can be passed into functions as arguments..
- Using parameters and arguments can be confusing at times, especially if you are just learning them. But if you first properly learn what a function is and how it works, you will understand parameters and arguments easily.
- Parameters are set when the function is defined.
- When a function is invoked, it’s provided with arguments.
