Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save GustavoEmmel/a27c004b81f5b6778d0f261ec334d76e to your computer and use it in GitHub Desktop.
Save GustavoEmmel/a27c004b81f5b6778d0f261ec334d76e to your computer and use it in GitHub Desktop.
Spread, Destructuring and Rest Operator (Javascript)
// 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
// #### 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
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment