destructured object javascript code example

Example 1: Destructuring Assignment

const HIGH_TEMPERATURES = {
  yesterday: 75,
  today: 77,
  tomorrow: 80
};

//ES6 assignment syntax
const {today, tomorrow} = HIGH_TEMPERATURES;

//ES5 assignment syntax
const today = HIGH_TEMPERATURES.today;
const tomorrow = HIGH_TEMPERATURES.tomorrow;

console.log(today); // 77
console.log(tomorrow); // 80
console.log(yesterday); // "ReferenceError: yesterday is not defined" as it should be.

Example 2: Object destructuring

Object Destructuring =>
//
   The destructuring assignment syntax is a JavaScript expression that makes it
possible to unpack values from arrays,
or properties from objects, into distinct variables.
//
example:
const user = {
    id: 42,
    is_verified: true
};

const {id, is_verified} = user;

console.log(id); // 42
console.log(is_verified); // true

Example 3: array destructuring

//Without destructuring

const myArray = ["a", "b", "c"];

const x = myArray[0];
const y = myArray[1];

console.log(x, y); // "a" "b"

//With destructuring

const myArray = ["a", "b", "c"];

const [x, y] = myArray; // That's it !

console.log(x, y); // "a" "b"

Example 4: object destructuring

let a, b, rest;
[a, b] = [10, 20];

console.log(a);
// expected output: 10

console.log(b);
// expected output: 20

[a, b, ...rest] = [10, 20, 30, 40, 50];

console.log(rest);
// expected output: Array [30,40,50]