Convert Array to Object Keys

Grab The Guides

No spam, just Javascript, web3 and indie hacking!


    We won’t send you spam. Unsubscribe at any time.

    I wanted to take an array of elements and turn them into an object. The elements in the array would need to be the keys of the object with some default empty strings as the values to be changed later.

    ['name','age','city', 'town', 'country']
      name: "",
      age: "",
      city: "",
      town: "",
      country: ""
    // end result I was looking for

    In the end I discovered that we could use Array.reduce (which I used to avoid before learning how to use it).

    We can create an empty object, pass over the array items and use them to dynamically create object keys.

    const userChoices = ['name','age','city', 'town', 'country'];
    const result = userChoices.reduce((acc, curr) => {
        acc[curr] = ""
        return acc
    }, {}) = "calvin"
    // { name: 'calvin', age: '', city: '', town: '', country: '' }

    The empty object is used as the accumulator which is passed back into the function and filled with the next item in the array.

    acc is the thing we’re trying to fill up and return while curr is the current item we’re working with in the data that we’re iterating over.

    Grab The Guides

    React Query
    Redux Toolkit
    React Testing Library
    Contact Me