Multiple Arguments: The arguments object is an array-like object that represents the passed arguments when invoking a function. This array-like object does not have the array prototype chain, hence it cannot use any of the array methods. It has length property but it does not have array’s built-in methods like forEach() and map() method.
Features:
- Arguments in Javascript are Passed by Value. This function only gets to know the values, not the arguments locations.
- Arguments.length In Javascript Depends on Invocation Arguments, Not Function Signatures.
- You can use arguments.length to determine how many arguments were passed-in during the given function invocation.
- Code readability is maximum.
Usage:
- arguments.callee: Reference to the currently executing function that the arguments belong to.
- arguments.length: The number of arguments that were passed to the function.
- arguments.caller: Reference to the function that invoked the currently executing function.
- arguments[@@iterator]: Returns a new Array Iterator object that contains the value for each index in arguments.
Example: This is an example of multiple arguments in javascript. Actually arguments is not like an arrays, It does not follow the array properties except Length. we can use all types of inputs into the function as multiple arguments. Within the function, we can pass multiple arguments but it is difficult to pass named arguments as multiple arguments.
-
Program:
<script>// Example of arguments of two// number a and b.function args(){
// Using for loop
// It can use length method
for(var i = 0; i < arguments.length; i++) {
console.log(arguments[i]);
}
}args(1, 3);</script> |
-
Output:
1 2
Options Object: Options object are a common pattern for passing named arguments into the function. When a function has two or more parameters then we can use the options object. For a function with four or more parameters then the options object is a good choice. A function has one or two-parameter and we want to add more parameters in the future so instead of rewriting the code later we can use options object.
The options object is different from multiple arguments because multiple arguments can take multi-type of arguments e.g. int, float, char, string…etc while options object can take named arguments like AlertIcon, etc only.
Features:
- This function can take up to 34 parameters, all of which are optional.
- Using the ‘options as an object’ approach is going to be best. You don’t have to worry about the order of the properties.
Usage:
- If you have more than four-parameter.
- At least one parameter is optional.
- Feel complex to figure out what parameter function takes.
Example:
-
Program:
<!DOCTYPE html><html>
<head>
<title>Option object</title>
<script type="text/javascript">
var courses = ['HTML', 'CSS',
'JavaScript', 'Bootstrap'];
function courselist() {
var countryList =
document.getElementById ("course");
for (var i = 0; i < courses.length; i += 1) {
// Option (text, value)
var courseOption =
new Option (courses[i], courses[i+1]);
countryList.options.add (courseOption);
}
}
</script>
</head>
<body onload="courselist()">
<select id="course"></select>
</body>
</html>
|
-
Output:
A dropdown menu of available courses
Differences between multiple Arguments and Options Object:
| Multiple Arguments | Options Objects |
|---|---|
| Multiple arguments are mostly for obligatory parameters. | Options object are mostly for named arguments. |
| Can not add more arguments after implementation without rewriting. | Can add more arguments after implementation without rewriting. |
| It have index properties like array e.g. arguments have index like [0, 1, 2, 3…]. | It does not have index properties like array. |
| It is Passed by Value. | It is Passed by Reference. |
| Can be use for any number of arguments but good for less number of arguments except optional arguments. | Can be use for more than four arguments with atleast one argument is optional. |