Spread, Destructuring and Rest Operator (Javascript)

spread-destructuring-rest-operator.js

// Execute: node spread-destructuring-rest-operator.js

// #### Spread Operator #### 
const e1 = 'CODE';
const r1 = [...e1];
console.log('[01]', r1) 
// Output => [ 'C', 'O', 'D', 'E' ]

const e2 = ['This', 'is', 'a', 'sentence'];
console.log('[02]', ...e2); 
// Output => This is a sentence

const obj1 = { foo: 'bar', x: 42 };
const clonedObj = { ...obj1 };
console.log('[03]', clonedObj); 
// Output => { foo: 'bar', x: 42 }

const quantity = [5, 6, 8, 9, 11, 999];
console.log('[04]', Math.max(quantity)); 
// Output => NaN
console.log('[05]', Math.max(...quantity)); 
// Output => 999

const o1 = { firstName: 'Foo', age: 22, repeat: 'A' };
const o2 = { lastName: 'Bar', gender: 'M', repeat: 'B' };
const newObj = { ...o1, ...o2, planet: 'Earth' };
console.log('[06]', newObj) 
// Output => { firstName: 'Foo', age: 22, repeat: 'B', lastName: 'Bar', gender: 'M', planet: 'Earth' }




// #### Destructuring Operator #### 
const address = [221, 'Baker Street', 'London'];
const [houseNo, , city] = address;
console.log('[07]', houseNo, city) 
// Output => 221 London

const list = [
  { id: 1, name: "Apple", age: 10 },
  { id: 2, name: "Google", age: 20 },
  { id: 3, name: "Facebook", age: 36 }
];

const [firstItem, secondItem] = list;
console.log('[08]', firstItem, secondItem); 
// Output => { id: 1, name: 'Apple', age: 10 } { id: 2, name: 'Google', age: 20 }

const [{ age }] = list;
console.log('[09]', age) 
// Output => 10

const [{ name: a, age: b }, i2] = list;
console.log('[10]', a, b); 
// Output => Apple 10

const details = { firstName: 'Code', lastName: 'Burst', count: 22 };
const { firstName, count } = details;
console.log('[11]', firstName, count); 
// Output => Code 22

const [{value} = {value: 0}] = list.filter(item => item.id === 10);
console.log(value);
// Output => 0



// #### Rest Operator #### 
const numbers = [1, 2, 3];
const [firstNumber, ...restOfTheNumbers] = numbers;
console.log('[12]', firstNumber, restOfTheNumbers); 
// Output => 1 [ 2, 3 ]

const fullName = "Follmann";
const [firstLetter, ...restOfTheLetters] = fullName;
console.log('[13]', firstLetter, restOfTheLetters); 
// Output => F [ 'o', 'l', 'l', 'm', 'a', 'n', 'n' ]

const contact = { firstName: 'Code', lastName: 'Burst', sum: 22 };
const { sum, ...restOfTheDetails } = contact;
console.log('[14]', sum, restOfTheDetails); 
// Output => 22 { firstName: 'Code', lastName: 'Burst' }

const myObject = { regex: "^http://.*", b: 2, c: 3 };
const { regex, ...noRegex } = myObject;
console.log('[15]', regex, noRegex); 
// Output => ^http://.* { b: 2, c: 3 }


// “TELL ME AND I FORGET. TEACH ME AND I REMEMBER. INVOLVE ME AND I LEARN.” 
//      – BENJAMIN FRANKLIN