I have this variable:

var a = {b:1, c:2, d:'rawr', rawr:10};

I want to destructure these into the local scope so I do:

var {b, c, d} = a;

This works fine but I need to get rawr out. I tried this:

var {b, c, d, [a.d]} = a;

But this gives me missing : after property id so I tried:

So I then though to do a two step:

var {b, c, d} = a;
var {[d]} = a;

However this gives me SyntaxError: missing : after property id. Is there anyway to do this in ES6?

Expected result is that:

var b = 1;
var c = 2;
var d = 'rawr';
var rawr = 10;

I have this variable:

var a = {b:1, c:2, d:'rawr', rawr:10};

I want to destructure these into the local scope so I do:

var {b, c, d} = a;

This works fine but I need to get rawr out. I tried this:

var {b, c, d, [a.d]} = a;

But this gives me missing : after property id so I tried:

So I then though to do a two step:

var {b, c, d} = a;
var {[d]} = a;

However this gives me SyntaxError: missing : after property id. Is there anyway to do this in ES6?

Expected result is that:

var b = 1;
var c = 2;
var d = 'rawr';
var rawr = 10;

• javascript
• ecmascript-6

• 2 I don't know for certain, but I would doubt that you'd be able to create a variable from a property name dynamically in the local scope. – user1106925 Commented May 5, 2016 at 0:25
• 1 Not certain what expected result is? – guest271314 Commented May 5, 2016 at 0:33
• 5 Lets assume this was possible, how would you access that variable (rawr)? – Felix Kling Commented May 5, 2016 at 0:40
• 2 XY Problem? What do you ultimately need to do? – user1106925 Commented May 5, 2016 at 0:43
• 2 @guest271314: I'm certain that the original object could be used. ECMAScript6 added this destructuring sugar for a reason though. People sometimes want to have local variable access to certain object properties. Sometimes it's for performance since reading a value from a variable is generally faster than reading an object from a variable and then looking up one of its properties. Or maybe they want to mutate a value locally without mutating the object. Destructuring is convenient for this purpose, but not strictly necessary. – user1106925 Commented May 5, 2016 at 15:33

4 Answers 4

You can destructure it like this:

var {b, c, d, [d]: q} = a;

So then whatever was in a property with a name d is assigned to q.

UPD:

What you asked in the update is not possible.*

You need to give it a variable to assign to. You cannot use "computed" variable names¹, as that would go against the rules of static scope resolution for identifiers. So you should do

var {b, c, d, [a.d]: rawr} = a;

to get the value of the a.d-named property in the rawr variable.

_{1: Well, you can use eval or a with statement in sloppy mode to do this, but both are despised exactly because of this.}

When dealing with computed objects property destruction the value of the string literal needs to correspond with the key name you are referencing in your object: for example

// string literal
const getRawr = 'd'
const { [getRaw]: rawr } = {b:1, c:2, d:'rawr', rawr:10};
console.log(raw);

You could use Object.keys(), Function.prototype.bind() though caveat is that value of variable is within an array; have not yet determined how to return only variable.

var a = {
  b: 1,
  c: 2,
  d: 'rawr',
  rawr: 10
};

function de(val, key) {
  var [val] = window[val] = [a[val]];
}

Object.keys(a).forEach(de.bind(this));

console.log(b, c, d, rawr);

jsfiddle https://jsfiddle.net/ravkgzjb/2/