The Spread operator

The spread operator allows you to expand iterable objects like arrays or objects. You can imagine it gets the data inside the brackets or curly braces and puts it somewhere else.

The spread operator is represented by three dots ...

In this code, we use the spread operator to merge firstArray and secondArray to make a merged array. And when you log the merged array, we get the combination of both arrays.

We can also do the same for objects,

const firstArray = ["html", "css", "javascript", "Node.js"];
const secondArray = ["skeleton", "styling", "logic", "back-end"];

const mergedArray = [...firstArray, ...secondArray];
console.log(mergedArray);
//  ["html", "css", "javascript", "Node.js","skeleton", "styling", "logic", "back-end"]


//Spread operators for object
const person1 = {
       name: "Emeka",
       age: 27
    };
const person2 = {
       name: "Lawrence",
       age: 30
    };

const mergedObject = {
        ...person1, ...person2
     };

console.log(mergedObject);
//{ name: "Emeka", 27, name: "Lawrence", age: 30 }

They can also be used to update data. Here we updated the age of person1 from 27 to 32.

const person1 = {
       name: "Emeka",
       age: 27
    };

const updatePerson1= {
        ...person1, age: 32
     };

console.log(updatePerson1);

// { name: "Emeka", 32 }