Exploring various object types in Javascript with JSON

Question

Exploring various object types in Javascript with JSON

Below is the code snippet I am using to generate an object:

var data = [];
data.push('{"headers":["Category 1","Value 1","Value 2"],"rows":[');
for (var i in results.data)
{
    entry = '["'+ results.data[i].Type +'", '+ results.data[i].Amount +', '+ results.data[i].Discount+'],';
    data.push(entry);
}
data.push(']}');

The desired object I want to create looks like this:

var my_data= {"headers":["Category 1","Value 1","Value 2"],"rows":[["Item A",174,23],["Item B",502,17],["Item C",242,37]...and so on]};

Is there a way to create the object directly without converting it to a string?

javascript json object

Answer 1

Answer №1

Commencing from the data in results.data, you have the ability to reorganize elements and construct fresh Objects without navigating through the chaos of Strings.

Employ Array.map() function to transform the server response into the intended rows array, then create a new Object:

const results = {
  data: [{
      Country: "Australia",
      Price: 174,
      Discount: 23
    },
    {
      Country: "Canada",
      Price: 502,
      Discount: 17
    },
    {
      Country: "France",
      Price: 242,
      Discount: 37
    }, {
      Country: "Germany",
      Price: 102,
      Discount: 42
    }
  ]
}

const rows = results.data.map(row => [row.Country, row.Price, row.Discount]);

var newData = {
  "headers": ["Dimension 1", "Metric 1", "Metric 2"],
  "rows": rows
};

console.log(newData);

Answer 2

Commencing from the data in results.data, you have the ability to reorganize elements and construct fresh Objects without navigating through the chaos of Strings.

Employ Array.map() function to transform the server response into the intended rows array, then create a new Object:

const results = {
  data: [{
      Country: "Australia",
      Price: 174,
      Discount: 23
    },
    {
      Country: "Canada",
      Price: 502,
      Discount: 17
    },
    {
      Country: "France",
      Price: 242,
      Discount: 37
    }, {
      Country: "Germany",
      Price: 102,
      Discount: 42
    }
  ]
}

const rows = results.data.map(row => [row.Country, row.Price, row.Discount]);

var newData = {
  "headers": ["Dimension 1", "Metric 1", "Metric 2"],
  "rows": rows
};

console.log(newData);

Exploring various object types in Javascript with JSON

Answer №1

Similar questions

Using React.js to compute dates based on user-inputted dates

Learning the process of dynamically binding an id to an HTML tag in Vue.JS

As you scroll, a box blocks off half of the screen

Whenever I attempt to install json-server using npm install -g json-server, I consistently encounter an error

Encountering an error while trying to implement a React Higher Order Component (HOC): the type provided is invalid – it should be a string or a

Tips for displaying ajax search results in Laravel views

Ways to determine if an image has a designated width/height using JavaScript (jQuery)

Is it possible to conceal or disregard text elements from the web browser search function by using CTRL+F?

Best method for connecting user input with a class

Why does my express POST request result in an empty req.body in Node.js?

Implementing the rendering functionality in Vuejs 3 to activate the parent component method from its child

Error message: Vercel is unable to locate the module or its corresponding type declarations when running the command "npm run build"

Using Angular ng-token-auth to post to an incorrect localhost address

Troubleshooting issue with Vue.js FullCalendar v5 component - events not showing up

Adjust the value of a select box to the chosen option using JQuery

How can I handle a 404 error if an object is not found in a JSON file?

Ensure that variables are accessible to asynchronous calls without the use of closures

Optimizing jQuery UI autocomplete choices through filtering

"Vue.js and Node.js have been successfully installed, with their respective versions displayed. However, the applications are

Can an HTML, CSS, and Javascript combination be used to create a sidebar addon for LibreOffice?