- Trending Categories
Data Structure
Networking
RDBMS
Operating System
Java
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
How to set dynamic property keys to an object in JavaScript?
In the following example we are going to learn how to set dynamic property keys to an object in JavaScript.
To add dynamic property keys to an object in JavaScript, there are three possible ways. There are three possible ways to set dynamic property keys to an object. The first possible way is to create a key and assign it to the object, second possible way is to set the dynamic property keys to an object using the define property method and the third possible way is to set the dynamic property keys to an object using ES6 method. We discussed each method with a suitable example.
Example 1
The below program is an example to create a key and assign it to the object.
<!DOCTYPE html> <html> <head> <title>To set dynamic property keys to an object in JavaScript</title> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body style="text-align : center"> <h3>To set dynamic property keys to an object in JavaScript</h3> <p id="dynamic-keys"></p> <script> let Employee = { name : 'Vinay', emp_id : 101 }; let key = "Company"; Employee[key] = 'Tutorials Point'; document.getElementById("dynamic-keys").innerHTML = 'Employee["name"] : '+ Employee['name'] +'<br/>'+'Employee["emp_id"] : '+Employee['emp_id']+'<br/>'+"Employee[key] : "+Employee[key]; </script> </body> </html>
On executing the above code, the following output is generated.
Example 2
The following is an example program to set the dynamic property keys to an object using the define property method.
<!DOCTYPE html> <html> <head> <title>To set dynamic property keys to an object in JavaScript</title> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body style="text-align : center"> <h3>To set dynamic property keys to an object in JavaScript</h3> <p id="dynamic-keys"></p> <script> let Employee = { name : 'Vinay', emp_id : 101 }; let key = "Company"; Employee[key] = 'Tutorials Point'; let key2 = 'role'; Object.defineProperty(Employee, key2,{value: 'Software Engineer'}) document.getElementById("dynamic-keys").innerHTML = 'Employee["name"] : '+ Employee['name'] +'<br/>'+'Employee["emp_id"] : '+Employee['emp_id']+'<br/>'+"Employee[key] : "+Employee[key]+'<br/>'+"Employee[key2] : "+Employee[key2]; </script> </body> </html>
On executing the above code, the following output is generated.
Example 3
The following is an example program to set the dynamic property keys to an object using ES6 method.
<!DOCTYPE html> <html> <head> <title>To set dynamic property keys to an object in JavaScript</title> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <ody style="text-align : center"> <h3>To set dynamic property keys to an object in JavaScript using ES6 Method.</h3> <p id="dynamic-keys"></p> <script> let key1 = "Company"; let key2 = 'role'; let Employee = { name : 'Vinay', emp_id : 101, [key1] : 'Tutorials Point', [key2] : 'Software Engineer' }; document.getElementById("dynamic-keys").innerHTML = 'Employee["name"] : '+ Employee['name'] +'<br/>'+'Employee["emp_id"] : '+Employee['emp_id']+'<br/>'+"Employee[key1] : "+Employee[key1]+'<br/>'+"Employee[key2] : "+Employee[key2]; </script> </body> </html>
On executing the above code, the following output is generated.
- Related Articles
- How to unflatten an object with the paths for keys in JavaScript?
- How to delete a property of an object in JavaScript?
- How to get Property Descriptors of an Object in JavaScript?
- How to convert square bracket object keys into nested object in JavaScript?
- JavaScript: replacing object keys with an array
- How to Declare an Object with Computed Property Name in JavaScript?
- JavaScript: How to remove the key-value pairs corresponding to the given keys from an object?
- How to create an object property from a variable value in JavaScript?
- Dynamic programming to check dynamic behavior of an array in JavaScript
- JavaScript map value to keys (reverse object mapping)
- How to set height equal to the dynamic width (CSS fluid layout) in JavaScript?
- How to set JavaScript object values dynamically?
- How to allocate memory to an object whose length is set to 0 - JavaScript?
- How to set a String as a key for an object - JavaScript?
- Convert set to object - JavaScript?
