Formatting Dynamic JSON array JavaScript
Last Updated :
18 Apr, 2024
Formatting a Dynamic JSON array is important because it organizes complex data structures, making them easier to read, manipulate, and communicate within applications and APIs. We will explore approaches to formatting dynamic JSON arrays in JavaScript.
Below are the approaches to format dynamic JSON arrays in JavaScript:
Using for...in Loop
In this approach, we are using a for...in loop to iterate over the elements in the jsonData array of objects. During each iteration, we extract the properties name, role, and experience from each object and push them into the res.temp array, resulting in a formatted JSON structure for the data.
Example: The below example uses for...in Loop to format dynamic JSON array in JavaScript.
JavaScript
let jsonData = [{
name: "Gaurav",
role: "Developer",
experience: 5
},
{
name: "Saurav",
role: "Designer",
experience: 3
},
{
name: "Ravi",
role: "Manager",
experience: 8
},
];
let res = {
temp: []
};
for (let i in jsonData) {
let item = jsonData[i];
res.temp.push({
"name": item.name,
"role": item.role,
"experience": item.experience
});
}
console.log(JSON.stringify(res, null, 2));
Output{
"temp": [
{
"name": "Gaurav",
"role": "Developer",
"experience": 5
},
{
"name": "Saurav",
"role": "Designer",
"experience": 3
},
{
"na...
Using Array.map()
In this approach, we are using Array.map() to iterate over the elements in the jsonData array of objects. For each item in the array, we extract the properties name, role, and experience, and push them into the res.gfg array, resulting in a formatted JSON structure for the data.
Example: The below example uses Array.prototype.map() to format dynamic JSON array in JavaScript.
JavaScript
let jsonData = [{
name: "Gaurav",
role: "Developer",
experience: 5
},
{
name: "Saurav",
role: "Designer",
experience: 3
},
{
name: "Ravi",
role: "Manager",
experience: 8
},
];
let res = {
gfg: []
};
jsonData.map(function (item) {
res.gfg.push({
"name": item.name,
"role": item.role,
"experience": item.experience
});
});
console.log(JSON.stringify(res, null, 2));
Output{
"gfg": [
{
"name": "Gaurav",
"role": "Developer",
"experience": 5
},
{
"name": "Saurav",
"role": "Designer",
"experience": 3
},
{
"nam...
Similar Reads
How Dynamic Arrays Work in JavaScript ? A dynamic array, also known as a resizable array or a dynamic array list, is a data structure that allows its size to be changed dynamically during program execution. Unlike static arrays, which have a fixed size determined at the time of declaration, dynamic arrays can grow or shrink in size as nee
3 min read
Convert an Array to JSON in JavaScript Given a JavaScript Array and the task is to convert an array to JSON Object. Below are the approaches to convert an array to JSON using JsvaScript: Table of ContentJSON.stringify() methodObject.assign() methodJSON.stringify() methodThe use of JSON is to exchange data to/from a web server. While send
2 min read
JavaScript | JSON Arrays The JSON Arrays is similar to JavaScript Arrays. Syntax of Arrays in JSON Objects: // JSON Arrays Syntax { "name":"Peter parker", "heroName": "Spiderman", "friends" : ["Deadpool", "Hulk", "Wolverine"] } Accessing Array Values: The Array values can be accessed using the index of each element in an Ar
2 min read
Convert Array to String in JavaScript In JavaScript, converting an array to a string involves combining its elements into a single text output, often separated by a specified delimiter. This is useful for displaying array contents in a readable format or when storing data as a single string. The process can be customized to use differen
7 min read
How to Declare an Array in JavaScript? Array in JavaScript are used to store multiple values in a single variable. It can contain any type of data like - numbers, strings, booleans, objects, etc. There are varous ways to declare arrays in JavaScript, but the simplest and common is Array Litral Notations. Using Array Literal NotationThe b
3 min read
How to Create Dynamic Values and Objects in JavaScript? In JavaScript, you can choose dynamic values or variable names and object names and choose to edit the variable name in the future without accessing the array, Dynamic values and objects in JavaScript allow changing, accessing, or creating values and object properties at runtime for flexibility and
3 min read