Destructure array to object property keys

javascript destructuring ecmascript-7 ecmascript-next
CodingIntrigue picture CodingIntrigue · Jul 7, 2016 · Viewed 11.9k times · Source

I have an array of values like:

const arr = [1,2,3];

Is there any way I can use destructuring to create the following output? If not, what is the easiest way I can do this in ES6 (or later)?

const obj = {
    one: 1,
    two: 2,
    three: 3
};

I tried this, but I guess it doesn't work as this is the syntax for computed keys:

const arr = [1,2,3];
const obj = {
  [one, two, three] = arr
};

Answer

user6445533 picture user6445533 · Jul 7, 2016

You can assign destructurings not only to variables but also to existing objects:

const arr = [1,2,3], o = {};    
({0:o.one, 1:o.two, 2:o.three} = arr);

This works without any additional variables and is less repetitive. However, it also requires two steps, if you are very particular about it.

I'm not sure if this helps, since you mentioned computed properties?!

Related questions

Typescript Object destructuring results in "Property assignment expected."

I am transitioning a project from Babel to Typescript and receive the following compiler error: error TS1136: Property assignment expected. from code that looks like this: var auth = {...this.props.auth}; This code previously worked fine under Babel, but causes …

Read More
JavaScript variable assignments from tuples

In other languages like Python 2 and Python 3, you can define and assign values to a tuple variable, and retrieve their values like this: tuple = ("Bob", 24) name, age = tuple print(name) #name evaluates to Bob print(age) #age evaluates to 24 Is …

Read More
One-liner to take some properties from object in ES 6

How one can write a function, which takes only few attributes in most-compact way in ES6? I've came up with solution using destructuring + simplified object literal, but I don't like that list of fields is repeated in the code. Is …

Read More