Javascript Processing JSON Data sample

Recently made a MEAN stack app. The backend uses NodeJS to get JSON data from the Jira Rest API and process it, and then the front end uses the AngularJS Ajax call to get the processed JSON data and display it to the App. Processed a lot of JSON data, decided to compile an example, write a summary.

JSON data processing is basically a conversion between JSON String and JSON Object.

JSON String is converted to JSON Object using the Json.parse method. Instead, use JSON. Stringify method.

In the following simple example, NodeJS gets the user order information (JSON String), processes the information, sets the "Show" field to true in the data that you want to display in the front-end, and sets the inverse to false. The front end then gets the data from the backend, outputting the data that needs to be displayed to the console. Codepen Example Links

1. Background data is obtained from other servers and processed:

Backstage NodeJs from other sites Restapi get the following JSON String containing information about the user's order at one time. User name, price, product information, etc. var Cart_json = ' {' username ': "[email protected]", "City": "Vienna", "state": "Virginia", "Country": "USA", " Products ": [{" Name ":" PlayStation4 "," category ":" PlayStation "," Price ":" $399.99 "," Quantity ": 1},{" name ":" HD sound Bar With Wireless subwoofer "," category ": ' Sound Bar '," Price ":" $899.99 "," Quantity ": 2},{" name ":" POV HD camcorder "," Category ":" Action Cam "," Price ":" $249.99 "," Quantity ": 1}]," Shipping ":" $10.00 "," Total ":" $2449.96 "} ';//JSON String Convert to JSON objectvar cart_obj = Json.parse (Cart_json);//Get products Objectvar Products_obj = cart_obj.products;//declare new AR Rayvar Products_arr = [];//iterates through the Products object, each field adds the corresponding field "show" to form the new object. If you want to show this field, the show value is set to true, and vice versa is false. for (var i = 0; i < Object.keys (products_obj). length; i + +) {product_name_obj = {name:products_obj[i].name, sh    Ow:true};    Product_category_obj = {category:products_obj[i].category, show:true}; Product_price_obj ={price:products_obj[i].price, show:false};    Product_quantity_obj = {quantity:products_obj[i].quantity, show:false}; Combine the new object into a new array to add the products_arr[i] = {"Product": [Product_name_obj, Product_category_obj, Product_price_  obj, Product_quantity_obj]};  }//new array is stored in the new JSON objectvar products_obj_new = products_arr;//Convert JSON object to JSON String var products_str_new =  Json.stringify (products_obj_new);//Output JSON object and JSON String in console for viewing Console.log (' JSON object: '); Console.log ( products_obj_new); Console.log (' JSON String: '); Console.log (products_str_new);

The console is as follows:

2. The front end obtains data processing from the background and displays:

Front-end JavaScript gets NodeJS generated JSON stringvar with Ajax call Products_str_get = products_str_new;//converts JSON String to JSON O Bjectvar products_obj_get = Json.parse (products_str_get);//output allows output of product information//traverse productsfor (var i = 0; i < objec T.keys (products_obj_get). length; i++)  {    var product_obj = products_obj_get[i].product;    Console.log ("Product" + i);    Iterate through the key in each product value pair for    (var j = 0; J < Object.keys (product_obj). length; j + +)    {      //if Sho A W field value of True displays the corresponding product information      if (product_obj[j].show)      {        var key = Object.keys (Product_obj[j]) [0];        var value = Product_obj[j][key];        Console.log (key + ":" + Value);}}}  

The console is as follows:

Javascript Processing JSON Data sample