Spread vs Rest Operator in JavaScript
Same three dots, opposite jobs — position tells you which one you're looking at.
The difference
Spread EXPANDS an iterable into individual elements (copying/merging arrays and objects, passing args). Rest COLLECTS remaining items into an array (function parameters, destructuring).
const merged = [...a, ...b]; // spread
const clone = { ...obj }; // spread
function sum(...nums) {} // rest
const [head, ...tail] = list; // restHow to tell them apart
If ... is where values are expected (an array literal, a call, an object literal), it's spread. If ... is where a binding collects leftovers (a parameter list, the left side of destructuring), it's rest.
Master modern JavaScript syntax
Spread/rest, destructuring, modules and every ES6+ feature — in the JavaScript Interview Kit.
⚡ Get the JavaScript Interview Kit → ₹299Frequently asked questions
- Are spread and rest the same operator?
- Same syntax, different roles decided by position: spread expands, rest collects.
- Is spread a deep copy?
- No — spread is a shallow copy; nested objects stay shared.