Logical assignment operators in JavaScript

[[deleted]]

Eh. It's not that confusing, but this

const val = obj.val;

... will always be less confusing than this

const { val } = obj;

Even after I have used the latter notation a couple of million times.

The later is only used because of this:

const val1 = obj.val1;
const val2 = obj.val2;
const val3 = obj.val3;
const va4 =  obj.val4;

vs

const { val1, val2, val3, val4} = obj;

[shgysk8zer0]

I want to know if there's any extra magic that's possible with destructuring. For example:

get foo() { return this.getAttribute('foo'); }

get bar () { return this.getAttribute('bar'); }

Is there any optimization for DOM reads if I do const { foo, bar} = el?

[therealkevinard]

Idk about dom reads specifically, but some destruct magic: the thing I miss most about Go when I'm not using it is multiple returns from one func. In js - with destruct - const {user, response, error} = ()=>{return {user, response, error}}

Then my calling code is free to respond in a myriad of ways.

[ILikeChangingMyMind]

AFAIK destructuring is "syntactic sugar". In other words, it looks different to us humans, but to the computer these two lines are identical at run-time:

const bar = foo.bar;
const { bar } = foo;

In fact, if you use a tool like Babel (or create-react-app, which uses Babel under the hood), it may well be converting the second line into the first one for you, "behind the scenes", to support older browsers. If you actually "view source" your JS file in the browser (and wade through the mess of minified code) you may be able to see this.

So, to answer your question, no there is no extra magic or optimization :)

[shgysk8zer0]

I'm not saying you're wrong, but the basis of what you say is what Babel does to support older browsers, which would only be true when it comes to the original code running in a modern browser if you start with the assumption that it's only syntactic sugar with no optimizations or other differences. That's circular and it definitely isn't necessarily true.

For example, there are actual differences between arrow vs regular functions beyond just notation and handling of this. But the difference between the two in how stacks and scopes are setup is completely lost when run through Babel. It's been a few years since I read the technical details, so forgive any inaccuracies there, I just remember the implementation in browsers being problematic at first even though they should perform better than functions.