How To Convert An Array To An Object Using JavaScript

This article will show you how to convert an Array to an Object using JavaScript . You can do it through methods: Using a Spread Syntax, Object.assign(), Array.reduce() or looping with Array.forEach().

Convert An Array To An Object Using Javascript

Using Spread Syntax

A Spread Syntax (...) is a way of breaking down an Object or Array into its key-value components.

Example:

const arr = ["a", "LearnShareIT", "d4c"];
const obj = {...arr};

console.log(obj);

Output:

{ '0': 'a', '1': 'LearnShareIT', '2': 'd4c' }

Using Object.assign()

The Object.assign() function takes a source and copies that source into a new Object.

Syntax:

Object.assign(Object target, source)

Parameters:

Example:

const arr = ["a", "LearnShareIT", "d4c"];
const obj = Object.assign({}, arr);

console.log(obj);

Output:

{ '0': 'a', '1': 'LearnShareIT', '2': 'd4c' }

Using Loops

While you can use a regular for loop using the of keyword, it would be better to use the .forEach() function to iterate over the array.

Syntax:

Array.forEach(function(value, int index) callback)

Parameters: 

Example with .forEach():

const arr = ["a", "LearnShareIT", "d4c"];
const obj = {};
arr.forEach((v, i) => {
	obj[i] = v;
});

console.log(obj);

Output: 

{ '0': 'a', '1': 'LearnShareIT', '2': 'd4c' }

Note: ()=>{} is the same as function(){}

Example with for loop:

const arr = ["a", "LearnShareIT", "d4c"];
const obj = {};
var i = 0;

for (const v of arr) {
	obj[i] = v;
	i++;
}

console.log(obj);

Output: 

{ '0': 'a', '1': 'LearnShareIT', '2': 'd4c' }

Note: Do not use in since it’s only used to check if key exists in an Object and not for iterating.

Using Array.reduce()

The Array.reduce() function iterates over an Array and returns a value to assign to initValue parameter, the prvValue parameter is initValue‘s value before getting assigned.

Syntax: 

Array.reduce(
    function(prvValue, value, int index) callback,
    initValue
)

Parameters:

Example:

const arr = ["a", "LearnShareIT", "d4c"];
const obj = arr.reduce((prv, val, ind) => ({ 
  	...prv, 
  	[ind]: val
}), {});

console.log(obj);

Output:

{ '0': 'a', '1': 'LearnShareIT', '2': 'd4c' }

Notes

Technically, an Array is an Object. They work differently in that an Array has integers as its keys while an Object uses a string (regardless if it’s a number or a regular string) as its keys.

Additionally, the Spread Syntax and Object.assign() methods will only return an Object with keys as the values of the original array, while the Array.reduce() and Array.forEach() method allows more freedom in key-value choice.

Summary

To convert an array to an object using Javascript, you have many options to do. All of the methods above can be used in many situations similar, so just pick whichever suits your need at the moment. A slightly different note, there are a lot of things you can do with the Array class’ methods, which can be viewed here.

Maybe you are interested:

• Convert an array to json using javascript
• Convert a Map to an Array of Objects in JavaScript
• How to Convert an Array to a Set in JavaScript

lywr

Full Name: Ly
Job: Editor
Major: IT
Programming Languages: Python, C, HTML, MySQL, SQL Server, C#, C++, Javascript, CSS, …