Why I Love The Spread Operator

Why I Love The Spread Operator

The Most Useful JavaScript Feature of ES6. Over the last few years, JavaScript has seen massive improvements to its syntax and functionality with the addition of a bunch new features.

Over the last few years, JavaScript has seen massive improvements to its syntax and functionality with the addition of a bunch new features.

One of the most useful of those new features is the spread operator (aka the … operator)

Spread is super helpful, but its syntax is not particularly meaningful upon first glance. It doesn’t tell you much as to what it does. Fortunately, once you learn the three main uses for Spread, it will become one of your favourite tools in the JS toolbox!

_According to MDN: _“Spread syntax allows an iterable such as an array expression or string to be expanded in places where zero or more arguments (for function calls) or elements (for array literals) are expected, or an object expression to be expanded in places where zero or more key-value pairs (for object literals) are expected.”

There are three places you can use spread:

  1. Function calls
  2. Array literals
  3. Object literals

Spread & Functions

When passing arguments to a function, We can use spread to expand an iterable element. Rather than having to pass each argument individually, We can “Spread” out each item as its argument.

**Math.min**is a function which accepts any number of arguments and returns the minimum value. If we wanted to find the minimum value of an array, It doesn't work to pass the entire array in:

const temperatures = [76,72,68,79,54,65];

Math.min(temperatures)
//Result
▶ NaN

Instead, we can use spread to expand our array, Passing in each element as an argument:

const temperatures = [76,72,68,79,54,65];
Math.min(...temperatures) 
//the same as Math.min(76,72,68,79,54,65)
//Result
▶ 54

Here’s one more example of using console.log. If we pass an entire array to console.log

const tvShows = ["Six Feet Under", "Chernobyl", "Black Mirror", "Fleabag " ]

console.log(tvShows);

programming javascript spread-operator web-development es6

Bootstrap 5 Complete Course with Examples

Bootstrap 5 Tutorial - Bootstrap 5 Crash Course for Beginners

Nest.JS Tutorial for Beginners

Hello Vue 3: A First Look at Vue 3 and the Composition API

Building a simple Applications with Vue 3

Deno Crash Course: Explore Deno and Create a full REST API with Deno

How to Build a Real-time Chat App with Deno and WebSockets

Convert HTML to Markdown Online

HTML entity encoder decoder Online

JavaScript Spread Operator (ES6 Tutorial)

Learn JavaScript Spread Operator (ES6 Tutorial). Using the spread operator in JavaScript (ES6) can be helpful in our daily programming lives. we are going to talk about the JavaScript Spread Operator, what it does, how to use it with some examples including arrays, objects, and functions.

What Javascript Spread Operator is, How It Works and How to Use It

JavaScript spread operator is one of the more popular features that were introduced in ES6. This tutorial will help you understand it. You will learn what spread operator is and how it works. You will also learn how to use it to copy and merge arrays and object literals, insert data and more.

JavaScript Spread Operator Explained (ES6)

Learn using the spread syntax with JavaScript arrays, objects, and functions. Using the spread operator in JavaScript (ES6) can be helpful in our daily programming lives. We are going to talk about the JavaScript Spread Operator, what it does, how to use it with some examples including arrays, objects, and functions.

Learning ES6 JavaScript Spread Operator

Learn how you can use JavaScript spread operator on arrays and objects. JavaScript spread operator (...) is used to expand the values of an iterable ( usually an array or an object) so that you can pass those values as arguments of a function.

JavaScript ES6 - Spread Operator - Advanced

Combine two arrays or objects in javascript? Append an object in existing object? This video will cover whole about spread operator in javascript and its various technical for manipulating data like object, arrays etc.