Getting Started with Modern JavaScript — Spread vs Rest

Photo by tripleMdesignz on Unsplash

JavaScript version ES6 (ES2015) brought us a couple of useful features for arrays represented by three dots (…), the rest parameter, and the spread operator. And ES2018 introduced the same syntax for objects.

It can be confusing to have one syntax represent two different uses. In this article, we will try to clear up the confusion and look into the two ways of using Javascript’s three dots.

In short we could say that:

• spread operator unpacks elements.
• rest parameter packs elements.

Definitions

• argument — An argument is a value passed to a function.
• parameter — A Parameter is a variable used in the declaration of a function.
• iterable— A collection of something that we can iterate (loop) over. For example array, list, set, and string.

Spread Operator

The spread operator unpacks iterables into individual elements. Let’s look into different…