destructuring an array code example

Example 1: unpack list javascript

var yourArray = [1, 2, 3, "four"]
// you can unpack those values by doing:
[a, b, c, d] = yourArray // If you want to unpack in variables

...yourArray // If you want to unpack directly where the "..." is (This One is mostly used to give argument to a function)
//Exemple:
consloe.log(yourArray) // will print: [1, 2, 3, "four"]
consloe.log(...yourArray) // will print: 1 2 3 "four"

Example 2: javascript object destructuring

//simple example with object------------------------------
let obj = {name: 'Max', age: 22, address: 'Delhi'};
const {name, age} = obj;

console.log(name);
//expected output: "Max"

console.log(age);
//expected output: 22

console.log(address);
//expected output: Uncaught ReferenceError: address is not defined

// simple example with array-------------------------------
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]

Example 3: destructure array javascript

var [first, second, ...rest] = ["Mercury", "Earth", ...planets, "Saturn"];

Example 4: 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 5: javascript function destructuring

function f() {
  return [1, 2];
}

let a, b; 
[a, b] = f(); 
console.log(a); // 1
console.log(b); // 2

Example 6: js object destructuring

const { [propName]: identifier } = expression;