The term “spread operator” is kind of an “umbrella term” that refers to various syntactic constructs in ES6 which all look like ...x. MDN does the same.
However, this is misguiding, because ... is not an operator (at least not in the sense the ECMAScript spec uses the term “operator”). It doesn’t generate a value that can be used in further computations. I’d rather compare it to other punctuators, such as , or ; (which are also kind of related but have different meaning in different context).
The term “spread operator” could refer to:
-
Spread element,
var arr = [a, b, ...c];: The spread element expands the iterable (c) into the new array. It’s equivalent to something like[a,b].concat(c). -
Rest element,
[a, b, ...c] = arr;†: Inside destructuring, the...construct has the opposite effect: It collects remaining elements into an array. The example here is equivalent toa = arr[0]; b = arr[1]; c = arr.slice(2);(note that this only an approximation, because destructuring works on any iterable value, not just arrays)
-
fun(a, b, ...c): This construct doesn’t actually have a name in the spec. But it works very similar as spread elements do: It expands an iterable into the list of arguments.
It would be equivalent tofunc.apply(null, [a, b].concat(c)).The lack of an official name might be the reason why people started to use “spread operator”. I would probably call it “spread argument”.
-
Rest parameter:
function foo(a, b, ...c): Similar like rest elements, the rest parameter collects the remaining arguments passed to the function and makes them available as array inc. The ES2015 actually spec uses the termBindingRestElementto refer to to this construct.
Related questions:
†: If we are very pedantic we would even have to distinguish between a variable declaration (var [a, b, ...c] = d;) and simple assignment ([a, b, ...c] = d;), according to the spec.