How to Convert JavaScript Array to Object

Array and Object are the most used data types in JavaScript. As a result, converting from one to another and vice-versa is a regular operation. The difference between array and object is that array does not have a key-value pair data structure, whereas Object has a key-value data structure.

If you convert an array to an object then by default, the object will take an index of an array as keys of the Object and array values as values of the object. Let’s see how to convert an array into an object.

JavaScript Array to Object

To convert an Array to Object in JavaScript, use the spread operator(…). The spread operator can be used when all elements from an object or array need to be included in a list.

let moneyheist = ["Tokyo", "Nairobi", "Berlin", "Oslo", "Moscow"]

let moneyheist_obj = {...moneyheist}

console.log("After converting an Array into an Object")
console.log(moneyheist_obj)

console.log("Check its data type using typeof()")
console.log(typeof (moneyheist_obj))

Output

After converting an Array into an Object
{
'0': 'Tokyo',
'1': 'Nairobi',
'2': 'Berlin',
'3': 'Oslo',
'4': 'Moscow'
}
Check its data type using typeof()
object

You can see that an array is successfully converted to the Object using the spread operator.

Converting an array to object using Object.assign()

The Object.assign() is a built-in method that copies all enumerable properties from one source object to a target object. Using the Object.assign() method, you can transform an array into an object.

Syntax

Object.assign(target, ...sources)

Arguments

target: It is the target object.

sources: It is the source object(s) that contains the properties you want to apply.

Return value

It returns the target object.

Example

Let’s define an array and convert it into an object.

let moneyheist = ["Tokyo", "Nairobi", "Berlin", "Oslo", "Moscow"]

let moneyheist_obj = Object.assign({}, moneyheist)

console.log("After converting an Array into an Object")
console.log(moneyheist_obj)

console.log("Check its data type using typeof()")
console.log(typeof (moneyheist_obj))

Output

After converting an Array into an Object
{
'0': 'Tokyo',
'1': 'Nairobi',
'2': 'Berlin',
'3': 'Oslo',
'4': 'Moscow'
}

Check its data type using typeof()
object

You can see that array becomes an object, and keys are 0, 1, 2, 3, 4 based on the array index.

The array starts with the 0th index, so the first key becomes 0 and then 1 and so on.

To check the datatype of the variable in JavaScript, use the typeof() method.

Convert using JavaScript array reduce()

The array.reduce() is a built-in JavaScript method that executes a user-supplied “reducer” callback function on each array element, passing in the return value from the calculation on the preceding element.

let moneyheist = ["Tokyo", "Nairobi", "Berlin", "Oslo", "Moscow"]

let moneyheist_obj = moneyheist.reduce((result, item, index, array) => {
 result[index] = item;
 return result
}, {})

console.log("After converting an Array into an Object")
console.log(moneyheist_obj)

console.log("Check its data type using typeof()")
console.log(typeof (moneyheist_obj))

Output

After converting an Array into an Object
{
'0': 'Tokyo',
'1': 'Nairobi',
'2': 'Berlin',
'3': 'Oslo',
'4': 'Moscow'
}
Check its data type using typeof()
object

We passed an empty object {} as a starting point, then “augment” that object incrementally.

Here, the reducer walks through the array item-by-item, at each step adding the current array value to the result from the previous step (this result is the running sum of all the previous steps) — until there are no more elements to add.

That’s it for this tutorial.

See also

JavaScript array to json

JavaScript object to string

JavaScript string to boolean

Leave a Comment