HOWTO · JavaScript
How to Pass Array to a Function in JavaScript
Learn when to pass an array as one argument, expand its elements into separate arguments with apply() or spread syntax, and read received values through the arguments object.
On this page
To pass an array to a JavaScript function, decide whether the function should receive the array as one value or receive its elements as separate positional arguments. Pass the array directly for one array parameter, use apply() or spread syntax to supply separate arguments, and read a supplied array from arguments[0] inside an ordinary function. These forms serve different function signatures.
The examples below are self-contained JavaScript snippets. The apply(), spread, and arguments examples show their observed output.
Use apply() to Pass Array Elements as Function Arguments
Function.prototype.apply() calls a function with a chosen this value and an array or array-like object whose entries become its positional arguments. The first parameter is the this value; the second is the argument list. It does not return an arguments object. The function’s own return value is what apply() returns. Use this form when you need to set this while supplying an argument list.
This example sends each array element to a corresponding parameter. The label comes from the selected this value.
const names = ['Mehvish', 'John', 'Henry', 'Thomas'];
function displayName(first, second, third, fourth) {
console.log(`${this.label}: ${first}, ${second}, ${third}, ${fourth}`);
}
displayName.apply({ label: 'Names' }, names);
Names: Mehvish, John, Henry, Thomas
If the function expects the array as one parameter, declare one parameter and pass names directly. The function receives the full array as that single value:
const names = ['Mehvish', 'John', 'Henry', 'Thomas'];
function displayName(names) {
console.log(names.join(', '));
}
displayName(names);
This signature differs from the four-parameter displayName above: direct passing gives the function one array argument, while apply() supplies the array’s four elements as four separate arguments. Spread syntax does the same element expansion at the call site.
Use the Spread Syntax to Pass Array Elements as Function Arguments
The spread syntax (...) expands an iterable such as an array into individual values at a function call. Each value is matched to a positional parameter in order. Use it when the function expects separate arguments and you do not need apply() to choose a this value.
const names = ['Mehvish', 'John', 'Henry', 'Thomas'];
function displayName(first, second, third, fourth) {
console.log(`${first}, ${second}, ${third}, ${fourth}`);
}
displayName(...names);
Mehvish, John, Henry, Thomas
Here, displayName receives four string arguments. By contrast, displayName(names) supplies one argument whose value is the full array. A function’s declared parameters and the call expression should match the form of data it needs. The spread expression works at the call site, so the function can keep ordinary named parameters.
Use the arguments Object to Read Function Arguments
The arguments object is available inside an ordinary function and contains the values passed to that call. It is array-like, with a length property and indexed entries, but it is not an Array. In particular, it does not have every Array method. Arrow functions do not define their own arguments object, so use an ordinary function for this pattern.
When you call a function with an array once, that array is at arguments[0]; arguments.length is 1. The function can then inspect or iterate over the array stored at that index. arguments describes values received by a function; it is not a way to pass an array.
const names = ['Mehvish', 'John', 'Henry', 'Thomas'];
function inspectArguments() {
console.log(arguments.length);
console.log(arguments[0].join(', '));
}
inspectArguments(names);
1
Mehvish, John, Henry, Thomas
To make a copy of the array-like arguments collection for array methods, use Array.from(arguments). For modern functions with a known set of inputs, named parameters or rest parameters are often clearer. Choose direct passing when the function needs the array as a collection, and choose apply() or spread syntax when it needs the array’s entries as separate parameters.