How to create an object from the given key-value pairs using JavaScript ?

In this article, we will learn to create an object from the given key-value pairs using JavaScript.Key-value pair: Unique identifier (key) associated with its corresponding value; fundamental for data organization and retrieval in programming. here we have some common approaches.

Following are some approaches to achieve the mentioned target.

• Using Numerical Keys and Values in JavaScript
• Using Object.assign()
• Using for loop
• Using a custom function
• Using the Map object

We will explore all the above methods along with their basic implementation with the help of examples.

Approach 1: Using Numerical Keys and Values in JavaScript

In this approach initializes an empty object and adds key-value pairs using numerical keys, resulting in an object with properties assigned to respective values.

Example 1: This is the simplest as well as the native approach. In this approach, we will directly append the key-value pair(s) in that previously created empty object.

Javascript

let object = {};
let firstKey = 0;
let firstKeyValue = "GeeksforGeeks";
let secondKey = 1;
let secondKeyValue = "Hello JavaScript";
let thirdKey = 2;
let thirdKeyValue = "Hello React";

object[firstKey] = firstKeyValue;
object[secondKey] = secondKeyValue;
object[thirdKey] = thirdKeyValue;
console.log(object);

Output

{ '0': 'GeeksforGeeks', '1': 'Hello JavaScript', '2': 'Hello React' }

Approach 2: Using Object.assign()

In this approach uses Object.assign() to add key-value pairs with numerical keys to an empty object, creating an object with properties assigned to corresponding values.

Example: In this example, we will use Object.assign() method which is the part of the Object superclass. This method will copy all the values and will append those values in the object as key-value pair(s).

Javascript

let object = {};
let firstKey = 0;
let firstKeyValue = "GeeksforGeeks";
let secondKey = 1;
let secondKeyValue = "Hello JavaScript";
let thirdKey = 2;
let thirdKeyValue = "Hello React";

Object.assign(object, { [firstKey]: firstKeyValue });
Object.assign(object, { [secondKey]: secondKeyValue });
Object.assign(object, { [thirdKey]: thirdKeyValue });

console.log(object);

Output

{ '0': 'GeeksforGeeks', '1': 'Hello JavaScript', '2': 'Hello React' }

Approach 3: Using for loop

In this approach we are using a loop to create an object by iterating over two arrays containing keys and values, assigning properties to the object accordingly.

Example: In this example, we will consider that our keys and their corresponding values are present in an array. We will first run a for loop over the array, and then we will dynamically append our data from the arrays into an empty object as key-value pair(s).

Javascript

let object = {};
let keys = [0, 1, 2];
let values = ["GeeksforGeeks",
    "Hello JavaScript", "Hello React"];
for (let i = 0; i < keys.length; i++) {
    object[keys[i]] = values[i];
}
console.log(object);

Output:

{ "0": "GeeksforGeeks", "1": "Hello JavaScript", "2": "Hello React" }

Approach 4: Using a custom function

The approach involves a custom function that takes arrays of keys and values as arguments. It iterates through the arrays, assigning properties to the object with corresponding keys and values.

Example: The example uses a custom function to create an object with numerical keys and corresponding string values from arrays.

Javascript

function createObject(keys, values) {
    const object = {};

    for (let i = 0; i < keys.length; i++) {
        object[keys[i]] = values[i];
    }

    return object;
}

const keys = [0, 1, 2];
const values =
    ["GeeksforGeeks", "Hello JavaScript", "Hello React"];

const object = createObject(keys, values);

console.log(object);

Output

{ '0': 'GeeksforGeeks', '1': 'Hello JavaScript', '2': 'Hello React' }

Approach 5: Using the Map object

In this approach we are using the Map object and the Object.fromEntries() method to create an object from arrays of keys and values, effectively mapping numerical keys to their corresponding string values.

Example: The example uses the Map object and Object.fromEntries() to create an object with numerical keys and string values from arrays.

Javascript

const keys = [0, 1, 2];
const values = ["GeeksforGeeks", "Hello JavaScript", "Hello React"];

const keyValuePairs = keys.map((key, index) => [key, values[index]]);
const object = Object.fromEntries(keyValuePairs);

console.log(object);

Output

{ '0': 'GeeksforGeeks', '1': 'Hello JavaScript', '2': 'Hello React' }