Passing arguments forward to another javascript function
The explanation that none of the other answers supplies is that the original arguments are still available, but not in the original position in the arguments
object.
The arguments
object contains one element for each actual parameter provided to the function. When you call a
you supply three arguments: the numbers 1
, 2
, and, 3
. So, arguments
contains [1, 2, 3]
.
function a(args){
console.log(arguments) // [1, 2, 3]
b(arguments);
}
When you call b
, however, you pass exactly one argument: a
's arguments
object. So arguments
contains [[1, 2, 3]]
(i.e. one element, which is a
's arguments
object, which has properties containing the original arguments to a
).
function b(args){
// arguments are lost?
console.log(arguments) // [[1, 2, 3]]
}
a(1,2,3);
As @Nick demonstrated, you can use apply
to provide a set arguments
object in the call.
The following achieves the same result:
function a(args){
b(arguments[0], arguments[1], arguments[2]); // three arguments
}
But apply
is the correct solution in the general case.
Use .apply()
to have the same access to arguments
in function b
, like this:
function a(){
b.apply(null, arguments);
}
function b(){
console.log(arguments); //arguments[0] = 1, etc
}
a(1,2,3);
You can test it out here.
Spread operator
The spread operator allows an expression to be expanded in places where multiple arguments (for function calls) or multiple elements (for array literals) are expected.
ECMAScript ES6 added a new operator that lets you do this in a more practical way: ...Spread Operator.
Example without using the apply
method:
function a(...args){
b(...args);
b(6, ...args, 8) // You can even add more elements
}
function b(){
console.log(arguments)
}
a(1, 2, 3)
Note This snippet returns a syntax error if your browser still uses ES5.
Editor's note: Since the snippet uses console.log()
, you must open your browser's JS console to see the result - there will be no in-page result.
It will display this result:
In short, the spread operator can be used for different purposes if you're using arrays, so it can also be used for function arguments, you can see a similar example explained in the official docs: Rest parameters