Open In App

How to add key/value pair to a JavaScript object ?

Improve
Improve
Like Article
Like
Save
Share
Report

JavaScript object has key-value pair and it can be of variable length. We first need to declare an object and assign the values to that object for that there can be many methods. In this article, we are going to apply different approaches to adding a key/value pair to a JavaScript object.

These are the following methods to add a key/value pair to a JavaScript object:

Method 1: Using Dot Notation

In this approach, we will directly access the key of an object by “.” for assigning the value to it. It can be a repeated method as every time we need to define a different key for different values.

Example: This example shows the implementation of the above approach.

Javascript




const obj = { Organisation: "GFG" };
obj.field = "CS";
 
console.log(obj);


Output

{ Organisation: 'GFG', field: 'CS' }

Method 2: Using Bracket Notation

In this approach, we are using Bracket to access the key and assign the value to it.

Example: This example shows the implementation of the above approach.

Javascript




const obj = { Organisation: "GFG" };
const Field = "field";
const Year = "year";
const lang = "lang";
obj[Field] = "CS";
obj[Year] = "2023";
obj[lang] = "English";
 
console.log(obj);


Output

{ Organisation: 'GFG', field: 'CS', year: '2023', lang: 'English' }

Method 3: Using Spread operator

In this approach, we are using Spread operator to assign the value to the object. we will create a new object and by using the spread operator we can add the old key and value to the new object with new key value pair.

Example: This example shows the implementation of the above approach.

Javascript




const obj = { Organisation: "GFG" };
const newObj = { ...obj, field: "CS" };
console.log(newObj);


Output

{ Organisation: 'GFG', field: 'CS' }

Method 4: Using Objcet.assign() method

In this approach, we are using Objcet.assign() method to assign the key and value to the object. We are passing the object name and the field that we want to use in the object. It assign those fields to the given object.

Example: This example shows the implementation of the above approach.

Javascript




const obj = { Organisation: "GFG" };
Object.assign(obj, { field: "CS" });
console.log(obj);


Output

{ Organisation: 'GFG', field: 'CS' }

Method 5: Using Objcet.defineProperty() method

In this approach, we are using Objcet.defineProperty() method to assign the key and value to the object. We are passing the object name and the field that we want to use in the object with some extra specification that is served by the method itself.

Example: This example shows the implementation of the above approach.

Javascript




const obj = { Organisation: "GFG" };
Object.defineProperty(obj, "field", {
    value: "CS",
    writable: false,
    enumerable: true,
    configurable: true,
});
console.log(obj);
// This won't change the 'field' key because
// 'writable' is set to false
obj.afield = "Civil";
console.log(obj);


Output

{ Organisation: 'GFG', field: 'CS' }
{ Organisation: 'GFG', field: 'CS', afield: 'Civil' }


Last Updated : 28 Dec, 2023
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads