Codementor Events

ES6 Chronicles: Through the looking glass...object literal enhancement

Published Dec 05, 2019
ES6 Chronicles: Through the looking glass...object literal enhancement

'Twas a lazy summer day for Alice and Kitty...puttering about with ECMAScript6 in the drawing room...

“Oh, Kitty”, Alice said, “I do so love the ES6 destructuring assignment that The Tenacious Techie taught me in his blog here!”, to which Kitty said “Mew!” and clicked her paw upon the link to bring it up in another browser window. “I love not having to do this three-liner...

let info={name: 'Alice', pet: 'Kitty', favorite_activity: 'Lollygagging'}

// Member-by-member assignment -- three-liner --
// Boy, that's a lot of typing...!
// And, oh so repetitious...
let name=info.name;
let pet=info.pet;
let favorite_activity=info.favorite_activity;

...and instead being able to do this one-liner...

let info={name: 'Alice', pet: 'Kitty', favorite_activity: 'Lollygagging'}

// Destructuring assignment -- one-liner
// That sure is a lot less typing...
// And very non-repetitious...
let { name, pet, favorite_activity } = info;

when I create variables based on an object's keys...!” “Mew, mewwww!”, replied Kitty. “But wouldn't it be even nicerer if we could extend our laziness through the looking glass to do the inverse operation and create an object from variables in a crazy lazy way?

I mean, isn't it too much effort to plunk in...

let name='Alice';
let pet='Kitty';
let favorite_activity='Lollygagging';

// My how repetitious: name: name, pet: pet, yaddah, yaddah, yaddah...
let info={name: name, pet: pet, favorite_activity: favorite_activity}

...when we create the info object from thename, pet, and favorite_activity variables...?” “Mew, mew, mewwww!”, replied Kitty. And before Alice even knew what she was doing, she had jumped upon the chimney piece and tapped the looking glass 3 times with her Magic ECMA Script Wand. At first nothing seemed to happened. But then, the looking glass became as a mist, and in a moment — SWOOOOSH!!! — she had swooshed through to the other side. “I did it, Kitty!”, Alice exclaimed. “I've swooshed through to the other side of the looking glass! And look, everything is reversed!” But Kitty could only reply with a faint “Wem” (a reversed “Mew.”) from the other side of the looking glass. “Who dares to invade my realm like William the Conqueror?”, an infuriated female voice shrilled into the mirrored drawing room. ‘Twas none other than The Most Volatile Queen of Hearts.

“It is I, Queen AMCE (for through the looking glass, ‘ECMA’ became ‘AMCE’), humble Alice, of the Queendom of ECMA, from the other side of the looking glass”, Alice replied, curtseying smartly.

“Be not wroth with me, O, Queenie, I desire only the simplest boon...that I may be allowed to carry thy destructuring assignment back through the looking glass to my queendom, the Queendom of ECMA...”

“Insolent, lazy, slothful child! And I'll bet she stole the tarts as well! Off with her head!” shrieked the Queen.

Off with her head!

“That is only thy Borderline Personality Disorder speaking,” said Alice. “Off with her head! Off With Her Head!! OFF WITH HER HEAD!!!” the Queen crescendoed... But as the guards came for her, Alice said, matter-of-factly, “Zero-Calorie Pop-Tarts.” “What didst thou say?”, asked the Queen, not matter-of-factly. “I have brought thee the recipe for Zero-Calorie Pop-Tarts, O Queen of Tarts...the only Pop-Tarts that don't go directly from your lips to your hips!” And Alice launched the recipe, folded up into a Soviet MiG-23 paper airplane, towards the Queen, who devoured it eagerly.

“Well, that's a horse of a different color!”, the queen said, silkily. “Takest thou the destructuring assignment back through the looking glass, and with my blessing, child...”

“Hasta la vista, Queenie!”, Alice blurted, grabbing up the destructuring assignment and swooshing back through the looking glass before the mercurial Queen could change her mind.

“Kitty, I have returned!”, Alice exclaimed. “And I brought the destructuring assignment back with me...but, look! It's not a destructuring assignment anymore. When I brought it through the looking glass, it became an object literal enhancement! Oh, I do hope this works, Kitty! Let's try it out in node.js!“

let name='Alice';
let pet='Kitty';
let favorite_activity='Lollygagging';

// Object Literal Enhancement -- "re-structuring assignment"
let info={name, pet, favorite_activity}

console.log("info =", info );
info = { name: 'Alice',
  pet: 'Kitty',
  favorite_activity: 'Lollygagging' }

“We did it, Kitty! We constructed a JavaScript object in the maximum lazy way! O frabjous day! Callooh! Callay!” she chortled in her joy. “Mew! Mew!! Mew!!!” Kitty affirmed.

And they hacked happily ever after.

Well...i'n't that nice...pretty soon you won't have to type in anything at all, with all these lazy ES6 shortcuts.

For more on initializing objects visit MDN here.

And until we meet again, The Tenacious Techie says, “Keep on hacking...!”

This blog post originally published at http://johndavidaynedjian.com/blog/es6-chronicles-through-the-looking-glass-object-literal-enhancement/

Discover and read more posts from John Aynedjian
get started
post commentsBe the first to share your opinion
Show more replies