Skip to content

Instantly share code, notes, and snippets.

@marta-krzyk-dev
Created June 19, 2020 15:21
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 marta-krzyk-dev/d7db2652ae92c2cbed7ef9b0e7f7fa1b to your computer and use it in GitHub Desktop.
Save marta-krzyk-dev/d7db2652ae92c2cbed7ef9b0e7f7fa1b to your computer and use it in GitHub Desktop.
Array and object destructing in JS
//Destructing arrays
const myArray = [1,2,3,4,5];
const [x,y,z] = myArray;
console.log(`${x} ${y} ${z}`);
const names = ["Parrot", "Dolpin", "Cat"];
//let name1, name2, name3, name4;
let [name1, name2, name3, name4="default"] = names;
console.log(`${name1} ${name2} ${name3} ${name4}`);
//Swapping
let aa = 100;
let bb = 250;
let cc = 500;
console.log("Before swapping:")
console.log(aa,bb,cc);
[bb,cc] = [cc,bb];
console.log("After swapping:")
console.log(aa,bb,cc);
function returnArray() {
return ["gummy bears", "donuts", "chocolate", "candy"];
}
const [sweet1, sweet2, sweet3, sweet4] = returnArray();
console.log(`${sweet1} ${sweet2} ${sweet3} ${sweet4}`);
function find(arr, term) {
return arr.filter(t => t===term);
}
const [result] = find(["gummy bears", "donuts", "chocolate", "candy"], "candy");
console.log(result);
//Skip some values
const arr = [10,11,12,13,14,15,16,17,18,19,20];
const [num1, num2, , num4, , num6 ] = arr;
console.log(`${num1} ${num2} ${num4} ${num6}`);
//REST pattern
const animals = ["dogs","cats","birds","snakes"];
const [dogs, cats, ...others] = animals;
console.log(`${dogs} ${others}`);
const object= { email: "admin@gmail.com", name: "John", surname: "Cat" };
const {surname, name, email} = object;
console.log(email, name, surname);
//Pitfall
let var1, var2;
const object2 = {var1 : "a", var2:"b"};
({var1, var2} = object2); // Let the interpreter know that {} is not a block of code
console.log(var1, var2);
//Match keys to different variable names
const object3 = {a : "cool", b:"yeah", c:"nice", d:"awesome"};
const {a:cool,b:yeah,c:nice,d:awesome, e:f="default"} = object3;
console.log(cool, yeah, nice, awesome, f);
function stateUser({user="Bob", memberType}) {
console.log(`Username: ${user}, membership type: ${memberType}`);
}
const member1 = {user: "Steve", memberType: "premium"};
const member2 = { memberType: "premium"};
stateUser(member1);
stateUser(member2);
function sayIfValid({prop: s}) {
console.log(s);
}
sayIfValid({prop: "I'm valid", a:1234, b:'yeah'});
sayIfValid({proop: "I'm valid"});
function isValid({a,b}) {
const internalObj = {
a,
b,
c: 124
};
return internalObj;
}
console.log(isValid(object3));
//Destructing nested arrays
let lists_ = [
{
created: Date.now(),
name: "things to do",
items: [
{ text: "Fry eggs", checked: false },
{ text: "Cook potatoes", checked: false },
{ text: "Play with cat", checked: true }
]
},
{
created: Date.now(),
name: "CSS",
items: [
{ text: "Fry eggs", checked: false },
{ text: "Cook potatoes", checked: false },
{ text: "Play with cat", checked: true }
]
}];
const user = {
email: "admin@gmail.com",
password: "ohno",
name: "John",
surname: "Cat",
lists: lists_,
};
let {name:name_, lists:[{name:list_name,created}]} = user;
console.log(list_name);
console.log(created);
const {lists:listy } = user;
for (const {created:cc, name:nn, items} of listy) {
console.log(`${cc} ${nn} ${items}`);
}
const mess = {
prop1: "oh",
prop2: [80,90]
};
const {prop1, prop2:[xx,yy]} = mess;
console.log(xx,yy);
//const {, prop2:[,yyy]} = mess;
//console.log(yyy);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment