Parameters & Arguments in JavaScript
Is a parameter and an argument one and the same?
![](https://miro.medium.com/v2/resize:fit:2400/1*aMM4d5PN4w4agBSx1Q6xrw.png)
Javascript is a functional language meaning that functions are the primary modular units of execution. Functions are obviously very important in Javascript. When talking about functions, the terms parameters and arguments are often interchangeably used as if it were one and the same thing but there is a very subtle difference.
- Parameters are variables listed as a part of the function definition.
- Arguments are values passed to the function when it is invoked.
Why should we bother about this minute difference?
Well for starters, JavaScript does not throw an error if the number of arguments passed during a function invocation are different than the number of parameters listed during function definition. This should make it clear that parameters and arguments should be treated as two different entities.
In the code snippet above the function argCheck
takes three parameters according to its function definition. On line 7 we call the function with an extra argument and the code executes without any errors. Similarly on line 11 we invoke the function with an argument less as compared to the number of parameters and it still does not throw any error. Hopefully this has convinced you that there is more to arguments
and parameters
and this article would discuss some features JavaScript provides in this context.
Basically, when excess arguments are provided, they don’t get assigned to any parameters. There are ways to access these excess assignments which we will get to in a bit. On the other hand if we have more parameters than the arguments, the parameters that have no corresponding arguments are set to undefined
. Lets explore JS features relating to arguments and parameters one by one.
The arguments parameter
No that is not a typo. The arguments
parameter is implicitly passed just like the this
parameter. It is a local variable accessible within all functions and contains an entry for each argument passed to that function. The arguments
object is an array-like construct which can be used to access arguments passed to the function even if a matching parameter isn’t explicitly defined.
See the code snippet above for the use of arguments
object. arguments.length
indicates the exact number of arguments which does not depend on the number of parameters in the function definition. Individual arguments can be accessed using array-like indexing notation.
One interesting feature of the arguments
object is that it aliases function parameters in non strict mode. What this means is that changing arguments[0]
would change parameter1
.
Rest Parameters
Rest Parameter is an ES6 addition to JavaScript. To create a rest parameter prefix the last parameter in a function definition with ellipsis(…).
In the code snippet above …restArgs
creates an array restArgs
that holds all the arguments passed to the function in an array. The rest parameter has to be the last parameter otherwise it throws a Syntax error : parameter after rest parameter
.
Two major differences between the arguments
object and rest parameters
:
Rest Parameters
is a real array and methods likeforEach
andsort
can be applied. Even though thearguments
object has thelength
method, it is not a real array and using array methods likesort
would only bring us misery and sorrow.Rest Parameters
contain only the arguments that have no corresponding parameter whilearguments
object contains all the arguments passed to the function. Code snippet #3 could also be written as follows.
Hopefully the article provided some information on arguments and parameters and why it is important to differentiate between the two. If you have any questions or want me to elaborate please leave me a note below.