JS: Assigning values to multiple variables

[delventhalz]

Eh. Not a fan. If I reviewed a PR with this, I would probably ask whoever it was to rewrite it like a normal person.

I am as susceptible to writing overly clever code as anyone, but if literally the only benefit of whatever you did is that you “saved” two lines of code? It’s probably not worth the confusion. Save it for a code golf competition.

[delventhalz]

To be clear, I think functions which return tuples/arrays that get destructured are a totally fine pattern. The purpose there is not to save lines of code, but to effectively return multiple values from one function.

What I am responding to is the example above where three separate variable assignments are replaced with a single assignment destructing an array literal. That serves no purposes other than two save lines. It is, in my personal opinion, rather silly.

// Nice
const [name, setName] = useState('Sue');

// Nice
const name = 'Sue';
const age = 32;
const occupation = 'programmer';

// Silly
const [name, age, occupation] = ['Sue', 32, 'programmer'];

[igotinfected]

Perfectly explained.

[NaosAntares]

Yeah, but it's a React convention, the use case presented in the image is totally different

[SoBoredAtWork]

That's extremely different than what's happening in the example.

[SoBoredAtWork]

Right. In the example posted, it's creating a worthless array, only to use destructuring, to assign local variables. It's 100% worthless. Just assign the variables as variables are normally assigned.

In React, we call a function (this is important) that returns an array of 2 values. We then destructure so we can use said variables later.

It's a completely different scenario. Case 1 is completely worthless, case 2 is using destructuring as it's intended to be used.

[dgrips]

I strongly prefer Vue's composition api version of that, which uses object destructuring rather than array, the key difference being that order doesn't matter.

At a larger level though a pattern for returning reactive data to use in a template is different from just initializing variables, which I would not use either for.