spread syntax code example

Example 1: spread operator in javascript

// spread operators can be used for arrays or objects

// cloning to prevent mutation.
let numList = [1,2,3];
let numListClone = [...numList]; // [1, 2, 3]

// spread operator for destructuring.
let animal = {
  name: 'dog',
  color: 'brown',
  age: 7
};
let { age, ...otherProperties } = animal; 

// spread operator as rest operator
function sum(x, y, ...rest) {}

// spread operator for merging arrays or objects
let numLists = [...numList1, ...numList2];
let animalWithBreed = {
  ...animal,
  breed: '',
}

Example 2: spread operator javascript

obj = {first_name : "Marty",
    lovers: ["Jennifer Parker","Baines McFly"]
      };
let objClone = { ...obj }; // pass all key:value pairs from an object 

console.log(objClone)
// { first_name: "Marty", lovers: ["Jennifer Parker", "Baines McFly"] }

Example 3: spread operator

function sum(x, y, z) {
  return x + y + z;
}

const numbers = [1, 2, 3];

console.log(sum(...numbers));
// expected output: 6
// This will add each item in number arrray in sum method.

console.log(sum.apply(null, numbers));
// expected output: 6

Example 4: ellipsis javascript

/* Spread syntax ( ex. ...arrayName) allows an iterable such as an array expression or string 
to be expanded in places where zero or more arguments (for function calls) 
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. */


//example
function sum(x, y, z) {
  return x + y + z;
}

const numbers = [1, 2, 3];

console.log(sum(...numbers));
// expected output: 6

Example 5: spread operator

function sum(x, y, z) {
  return x + y + z;
}

const numbers = [1, 2, 3];

console.log(sum(...numbers));
// expected output: 6

console.log(sum.apply(null, numbers));
// expected output: 6

Tags:

Css Example