Example of Javascript processing JSON data, javascriptjson

Example of Javascript processing JSON data, javascriptjson

Recently I made an app for MEAN stack. The background uses NodeJS to obtain and process JSON data from the Jira rest api, and then the frontend uses AngularJS Ajax call to obtain the processed JSON data and display it to the App. After processing a lot of JSON data, I decided to compile an example and write a summary.

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

Use the JSON. parse method to convert a JSON String to a JSON Object. Otherwise, use the JSON. Stringify method.

In the following simple example, NodeJS obtains the user order information (JSON String), processes the information, and sets "show" field to true in the data to be displayed in the front end, otherwise, set it to false. Then, the front-end obtains data from the backend and outputs the data to be displayed to the console. CodePen sample Link

1. the backend obtains and processes data from other servers:

// The background node. js obtains the following JSON String from restAPI of another website that contains the user's order information. User name, price, product information, etc. Var cart_json = '{"username": "christy@gmail.com", "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"," Tal ":" $2449.96 "} '; // converts a JSON String to JSON objectvar cart_obj = JSON. parse (cart_json); // get the products objectvar products_obj = cart_obj.products; // declare the new arrayvar products_arr = []; // traverse the products object, each field is added with the corresponding field "show" to form a new object. If you want to display this field, set show to true, and vice versa. For (var I = 0; I <Object. keys (products_obj ). length; I ++) {product_name_obj = {name: products_obj [I]. name, show: 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}; // Add the new object together to the new array: products_arr [I] = {"product": [product_name_obj, product_category_obj, product_price_obj, product_quantity_obj] };}// the new array stores the new JSON objectvar products_obj_new = products_arr; // converts a JSON object to a JSON String var products_str_new = JSON. stringify (products_obj_new); // output the JSON object and JSON String in the console for viewing the console. log ('json object: '); console. log (products_obj_new); console. log ('json String: '); console. log (products_str_new );

Console:

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

// The front-end javascript obtains the JSON Stringvar products_str_get = products_str_new generated by NodeJS through Ajax call; // converts the JSON String to JSON objectvar products_obj_get = JSON. parse (products_str_get); // output the product information that can be output // traverse productsfor (var I = 0; I <Object. keys (products_obj_get ). length; I ++) {var product_obj = products_obj_get [I]. product; console. log ("product" + I); // traverses the key value pair for (var j = 0; j <Object. keys (product_obj ). length; j ++) {// if the show field value is true, the corresponding product information is displayed if (product_obj [j]. show) {var key = Object. keys (product_obj [j]) [0]; var value = product_obj [j] [key]; console. log (key + ":" + value );}}}

Console: