JavaScript manipulating JSON objects

Keywords: JSON Javascript JQuery

JSON(JavaScript Object Notation) is a lightweight data exchange format, which is completely independent of the language text format. It is an ideal data exchange format. At the same time, JSON is a native JavaScript format, which means that you don't need any special API or toolkit to process JSON data in JavaScript.

1. Declare JSON object:

var json_obj = {};
console.log(json_obj);
console.log(typeof json_obj);


2. Add elements:

var json_obj = {};
var name= 'soufan_data_acquisitionDemo';
json_obj[name] = {node_name: "ONE-FINE", status: "ok", pending: Array(0), running: Array(0), finished: Array(0)};
// The following effects are the same, and the advantages are not as obvious as those above
// json_obj.name = {node_name: "ONE-FINE", status: "ok", pending: Array(0), running: Array(0), finished: Array(0)};
console.log(json_obj);
console.log(typeof json_obj);


3. Modification elements:

var json_obj = {};
var name = 'soufan_data_acquisitionDemo';
json_obj[name] = {node_name: "ONE-FINE", status: "ok", pending: Array(0), running: Array(0), finished: Array(0)};
json_obj.soufan_data_acquisitionDemo = "I was modified";
console.log(json_obj);
console.log(typeof json_obj);


4. Query elements:

var json_obj = {};
varname = 'soufan_data_acquisitionDemo';
json_obj[name] = {node_name: "ONE-FINE", status: "ok", pending: Array(0), running: Array(0), finished: Array(0)};
json_obj.soufan_data_acquisitionDemo = "I was modified";
console.log(json_obj.soufan_data_acquisitionDemo);
console.log(json_obj[name]);
console.log(json_obj['soufan_data_acquisitionDemo']);

5. Delete element:

var json_obj = {};
var name = 'soufan_data_acquisitionDemo';
json_obj[name] = {node_name: "ONE-FINE", status: "ok", pending: Array(0), running: Array(0), finished: Array(0)};
json_obj.soufan_data_acquisitionDemo = "I was modified";
console.log(json_obj);
delete json_obj[name];
console.log(json_obj);


6. Traversal:

$(function() {
    var json = [ {
        "id" : "1",
        "tagName" : "apple"
    }, {
        "id" : "2",
        "tagName" : "orange"
    }, {
        "id" : "3",
        "tagName" : "banana"
    }, {
        "id" : "4",
        "tagName" : "watermelon"
    }, {
        "id" : "5",
        "tagName" : "pineapple"
    } ];

    $.each(json, function(idx, obj) {
        alert(idx+"---"+obj.tagName);
    });
});

7. Conversion:

json string to json object: jQuery.parseJSON(jsonStr);
JSON object to JSON string: JSON.stringify(jsonObj);

Reference resources:

Adding, deleting and modifying json objects https://www.cnblogs.com/louby/p/7513263.html
json operation in jquery https://www.cnblogs.com/tingbogiu/p/5826414.html

Attachment: add, delete and modify the json object for js operation, source: https://www.cnblogs.com/louby/p/7513263.html

//Serialize the form into a string
$.fn.serializeObject = function () {
    var obj = {};
    var count = 0;
    $.each(this.serializeArray(),
        function (i, o) {
            var n = o.name, v = o.value;
            count++;
            obj[n] = obj[n] === undefined
                ? v
                : $.isArray(obj[n])
                    ? obj[n].concat(v)
                    : [obj[n], v];
        });
    obj.nameCounts = count + ""; //Number of form name s
    return JSON.stringify(obj);
};

//Add or modify json data
function setJson(jsonStr, name, value) {
    if (!jsonStr) jsonStr = "{}";
    var jsonObj = JSON.parse(jsonStr);
    jsonObj[name] = value;
    return JSON.stringify(jsonObj);
}

//Delete data
function deleteJson(jsonStr, name) {
    if (!jsonStr) return null;
    var jsonObj = JSON.parse(jsonStr);
    delete jsonObj[name];
    return JSON.stringify(jsonObj);
}

////Build test
//    var myjsonStr = setJson(null,"name","aaa");
//    alert(myjsonStr);
////Add test
//    myjsonStr = setJson(myjsonStr,"age",18);
//    alert(myjsonStr);
////Modify test
//    myjsonStr = setJson(myjsonStr,"age",20);
//    alert(myjsonStr);
////Delete test
//    myjsonStr = deleteJson(myjsonStr,"age");
//    alert(myjsonStr);

Recommend:

JSON summary of JS operation https://www.cnblogs.com/worfdream/articles/1956449.html
Using Jquery to analyze the basic knowledge of Json http://www.cnblogs.com/madyina/p/3448518.html

Posted by NiallThistle on Mon, 18 Nov 2019 10:50:23 -0800