Multiple assignments

As I slowly join the masses in using ES6 to a fuller extent (than my previous Promise only-ES6), I'm discovering new and interesting ways to play with the language. I'm even learning that some stuff just didn't work the way I thought.

Multiple assignments

It's not uncommon to see multiple assignments in a single line in my code. Something like this:

// creating short variable name to exports
const app = module.exports = { /* exports */ };

Though, it's almost an anti-pattern because it could leak a global by accident. Take this code in the browser for instance:

function calc(v) {
  var value = max = 10;
  // …
}

Yup, I've leaked the max value as a global. Still, so long as I'm careful, it's useful.

Destructuring

This is where I got caught out. Take the following example (though mildly convoluted). The intention of the following code was to take a pre-existing object (the value on the right hand side), destruct it into a new object containing a subset of the properties from the RHS.

So in the example below, what's the value of one.c?

JS Bin on jsbin.com

What did I expect?

In the past, when I look at multiple assignments, I've always read it a bit like right-to-left presidence. Sort of like this:

// a = b = 10
b = 10, a = b;

What you're seeing on the left, is the result of the expression on the right.

This doesn't have any significance when you're assigning something simple like a = b = 10, because the result of the expression b = 10 is 10.

However, this is important when I was working with destructuring (in the example above), because the result of the expression is the right hand side, is the value of two.

Since the result of the of { a, b, d} = two is the value of two, then the value of one.c will be the same as two.c, not undefined as I had hoped.

What's really going on here?

This might be easier to you get your head around if you look at the following example:

JS Bin on jsbin.com

In the first expression, I'm assigning a = 2, but a has a set method, and doesn't do anything with the value. The result of the expression is logged out: 2. This is irrespective of the value of a.

When I log the value of a again, it's 1 and was never modified.

Multiple assignments