Traverse through the nested JSON array using a loop

Question

Traverse through the nested JSON array using a loop

Exploring a JSON object:

{
  "date_price": [
    {
      "date": "Jan 2000",
      "price": 1394.46
    },
    {
      "date": "Feb 2000",
      "price": 1366.42
    },
    {
      "date": "Mar 2000",
      "price": 1498.58
    },
    {
      "date": "Apr 2000",
      "price": 1452.43
    }
  ]
}

In order to iterate through and store each date-price pair in a simple array, you can use the following approach:

var transformation = [];

transformation.push({date: i, price: d})

The challenge arises because the JSON object contains objects inside an array, making it impossible to directly utilize the forEach() loop on it.

javascript arrays json

Answer 1

Answer №1

If you have already parsed the JSON into an object...

let obj = JSON.parse(json);

...iterate through the data using map.

Please note: instead of an array of objects (as mentioned in your question), based on your feedback you are looking for a nested array structure.

Using ES5:

const transformation = obj.date_price.map(function(el) {
  return [ el.date, el.price ];
});

Using ES6:

const transformation = obj.date_price.map(el => [ el.date, el.price ]);

OUTPUT

[
  ["Jan 2000", 1394.46],
  ["Feb 2000", 1366.42],
  ["Mar 2000", 1498.58],
  ["Apr 2000", 1452.43]
]

DEMO

Answer 2

If you have already parsed the JSON into an object...

let obj = JSON.parse(json);

...iterate through the data using map.

Please note: instead of an array of objects (as mentioned in your question), based on your feedback you are looking for a nested array structure.

Using ES5:

const transformation = obj.date_price.map(function(el) {
  return [ el.date, el.price ];
});

Using ES6:

const transformation = obj.date_price.map(el => [ el.date, el.price ]);

OUTPUT

[
  ["Jan 2000", 1394.46],
  ["Feb 2000", 1366.42],
  ["Mar 2000", 1498.58],
  ["Apr 2000", 1452.43]
]

DEMO

Answer 3

Answer №2

EDIT: If you already have the JSON as an object, you can simply extract the date_price property from it. This will give you an array of the exact object types you need.

var result = jsonObject.date_price; // This is the array you are looking for.

Alternatively...

var result = jsonObject['date_price']; // This is the array you are looking for.

Previous response assumed a JSON string...

If you have a JSON string like this...

// Here is your JSON string
var text = '{ "date_price": [ { "date": "Jan 2000", "price": 1394.46 }, { "date": "Feb 2000", "price": 1366.42 }, { "date": "Mar 2000", "price": 1498.58 }, { "date": "Apr 2000", "price": 1452.43 } ] }';

// Convert it into an object
var obj = JSON.parse(text);

// Access the date_price property which is already an array
var result = obj.date_price;

// Output to demonstrate
console.log(result);
for (var i = 0; i < result.length; i++) {
    console.log(result[i]);
}

Answer 4

EDIT: If you already have the JSON as an object, you can simply extract the date_price property from it. This will give you an array of the exact object types you need.

var result = jsonObject.date_price; // This is the array you are looking for.

Alternatively...

var result = jsonObject['date_price']; // This is the array you are looking for.

Previous response assumed a JSON string...

If you have a JSON string like this...

// Here is your JSON string
var text = '{ "date_price": [ { "date": "Jan 2000", "price": 1394.46 }, { "date": "Feb 2000", "price": 1366.42 }, { "date": "Mar 2000", "price": 1498.58 }, { "date": "Apr 2000", "price": 1452.43 } ] }';

// Convert it into an object
var obj = JSON.parse(text);

// Access the date_price property which is already an array
var result = obj.date_price;

// Output to demonstrate
console.log(result);
for (var i = 0; i < result.length; i++) {
    console.log(result[i]);
}

Answer 5

Answer №3

Easy solution utilizing JSON.parse along with Array.map methods:

let jsonStr = '{"date_price": [{ "date": "Jan 2000", "price": 1394.46 },{"date": "Feb 2000",      "price": 1366.42},{"date": "Mar 2000","price": 1498.58},{"date": "Apr 2000","price": 1452.43}]}',
    jsonObj = JSON.parse(jsonStr);

//let transformation = jsonObj["date_price"]; // to retrieve a nested array

let transformation = jsonObj["date_price"].map(function(v){ return v; }); // to simulate a test loop
    
document.write("<pre>"+ JSON.stringify(transformation, 0, 4) + "</pre>");

Answer 6

Easy solution utilizing JSON.parse along with Array.map methods:

let jsonStr = '{"date_price": [{ "date": "Jan 2000", "price": 1394.46 },{"date": "Feb 2000",      "price": 1366.42},{"date": "Mar 2000","price": 1498.58},{"date": "Apr 2000","price": 1452.43}]}',
    jsonObj = JSON.parse(jsonStr);

//let transformation = jsonObj["date_price"]; // to retrieve a nested array

let transformation = jsonObj["date_price"].map(function(v){ return v; }); // to simulate a test loop
    
document.write("<pre>"+ JSON.stringify(transformation, 0, 4) + "</pre>");

Answer 7

Answer №4

This is the perfect solution as it is already in the exact format required, all you need to do is remove the nesting.

var dataObj = {
  "date_price": [
    {
      "date": "Jan 2000",
      "price": 1394.46
    },
    {
      "date": "Feb 2000",
      "price": 1366.42
    },
    {
      "date": "Mar 2000",
      "price": 1498.58
    },
    {
      "date": "Apr 2000",
      "price": 1452.43
    }
  ]
};

var dataArray = dataObj['date_price'];

Follow these steps and you're good to go!

Answer 8

This is the perfect solution as it is already in the exact format required, all you need to do is remove the nesting.

var dataObj = {
  "date_price": [
    {
      "date": "Jan 2000",
      "price": 1394.46
    },
    {
      "date": "Feb 2000",
      "price": 1366.42
    },
    {
      "date": "Mar 2000",
      "price": 1498.58
    },
    {
      "date": "Apr 2000",
      "price": 1452.43
    }
  ]
};

var dataArray = dataObj['date_price'];

Follow these steps and you're good to go!

Answer 9

Answer №5

Here is an example code snippet that demonstrates how you could achieve this:

let data = {
 "date_price": [
{
  "date": "Jan 2021",
  "price": 2000
},
{
  "date": "Feb 2021",
  "price": 2100
},
{
  "date": "Mar 2021",
  "price": 2200
},
{
  "date": "Apr 2021",
  "price": 2300
}
]
}

let newArray = Object.values(data).map((value) => {
    return value;
});

https://example.com/code-example

Answer 10

Here is an example code snippet that demonstrates how you could achieve this:

let data = {
 "date_price": [
{
  "date": "Jan 2021",
  "price": 2000
},
{
  "date": "Feb 2021",
  "price": 2100
},
{
  "date": "Mar 2021",
  "price": 2200
},
{
  "date": "Apr 2021",
  "price": 2300
}
]
}

let newArray = Object.values(data).map((value) => {
    return value;
});

https://example.com/code-example

Traverse through the nested JSON array using a loop

Answer №1

Answer №2

Answer №3

Answer №4

Answer №5

Similar questions

Include the URL as a parameter in the query when utilizing Tesseract OCR

Utilizing ng-bind-html to establish Angular bindings within the HTML code

URL for requesting JSON data using Zend Framework

Error: The specified schema for the model "superheroes" is missing and has not been registered. Please ensure the schema is properly defined and registered

How to retrieve a value from PHP using Ajax?

Pattern matching for ' ... '

The Express API will only provide the initial key-value pair of an object in the response

Delete the child element if it is present in an HTML document

What is the process for customizing the color and thickness of the active tab inkBarStyle in React Material-UI?

How can I solve a tridiagonal matrix using Python code?

Explore the full range of events available on the Angular UI-Calendar, the innovative directive designed for Arshaw FullCalendar

Having issues with the Carousel feature in Bootstrap 5.3.1 while using Angular version 15

Tips for retrieving page source with selenium Remote Control

JavaScript's square bracket notation is commonly used to access nested objects within an object

Creating two variables that share an identical name

What is the best way to change an array of strings into a single string in JavaScript?

Arranging arrays of various types in typescript

Troubleshooting SQLite Query Problems in Flask

Adding Bootstrap to container-specific styling in SCSS

Changing the background color of the dropdown button in Vue Bootstrap: A step-by-step guide