What does '...' mean in JavaScript?

Last Updated : 07 Mar, 2025

The '...' (or 3 dot symbol) in JavaScript is known as the Spread operator or Rest operator based on the usage. This syntax is used to expand the iterable into individual elements such as arrays, objects, etc.

Syntax for Spread Operator

cosnt a1 = [ 10, 20, 30, 40 ];
const a2 = [ ...a1, 50]; // Extracting the array elements using Spread Operator
// Final value of a2 => [ 10, 20, 30, 40, 50 ]

Syntax for Rest Parameter

const a  = [ 10, 20, 30, 40, 50 ]
const [ a1 , ... restA ] = a; // Destructureing the aray using Rest Operator
// Final value of a1 => 10, restA => [ 20, 30, 40, 50 ]

The meaning of "..." in JavaScript can be interpreted in the following context.

Spread Operator (...)

The spread operator takes an array or object and spreads its elements or properties into individual components. It’s typically used when we need to pass an array’s elements into a function, combine arrays, or clone objects.

Now let's understand the uses of spread operator using some examples:

Spreading Arrays

One common use of the spread operator is to easily expand arrays. This is useful when we want to combine arrays or make copies without altering the original.

Example: This example creates a new array by adding few elements in the given array.

JavaScript

const a = [ 10, 20, 30 ]; const newA = [...a, 40, 50 ]; console.log(newA);

Output

[ 10, 20, 30, 40, 50 ]

Passing Array Elements as Function Arguments

The spread operator can also be used to pass array elements as individual arguments to a function.

Example: This example passes the array using spread operator to pass individual elements as arguments.

JavaScript

const a = [10, 20, 30]; const maxNum = Math.max(...a); console.log(maxNum);

Output

Cloning Arrays

The spread operator makes it simple to create shallow copies of arrays.

Example: This example creates a clone of the given array using spread operator.

JavaScript

const a1 = ['apple', 'banana', 'cherry']; const a2 = [...a1]; console.log(a2);

Output

[ 'apple', 'banana', 'cherry' ]

Spreading Objects

The spread operator can also be applied to objects it allows us to copy or merge them.

Example: This example creates a new object with exetended properties using the given object.

JavaScript

const obj1 = { name: 'Ajay', age: 25 }; const obj2 = { ...obj1, city: 'New York' }; console.log(obj2);

Output

{ name: 'Ajay', age: 25, city: 'New York' }

Rest Operator (...)

The rest operator is the inverse of the spread operator. While the spread operator expands elements, the rest operator collects multiple elements or properties into a single entity, usually an array.

Now let's understand uses of rest operator using some examples:

Using Rest in Function Parameters

The most common use of the rest operator is in function parameters where you don’t know how many arguments will be passed. The rest operator gathers all arguments into an array.

Example: This example convertes the array passed as arguments into individual elements in function declaraion using rest parameter.

JavaScript

function sum(...numbers) {     return numbers.reduce((total, num) => total + num, 0); }  console.log(sum(1, 2, 3)); console.log(sum(4, 5, 6, 7));

Output

6 22

Destructuring Arrays with Rest

The rest operator can also be used in array destructuring to collect the remaining elements after certain ones are assigned.

Example: This example separates or destructure the elements as first, second and rest elements.

JavaScript

const [first, second, ...rest] = [10, 20, 30, 40, 50];  console.log("First element =", first); console.log("Second element =", second); console.log("Rest elements =", rest);

Output

First element = 10 Second element = 20 Rest elements = [ 30, 40, 50 ]

Destructuring Objects with Rest

The rest operator can also be used to extract specific properties from an object, while collecting the remaining properties in a new object.

Example: This example desctructures the object and extracts properties from the object.