javascript处理操作json的常用案例

标签: javascriptjson   时间:2017-09-27
无论是什么语言的编程,我们都会接触到json,json在各个语言编程中无处不在,本文章向大家介绍javascript处理操作json的常用案例,需要的朋友可以参考一下。

1.JSON字符串转换为JSON对象

JSON字符串:

var str1 = '{ "name": "cxh", "sex": "man" }'; 

JSON对象:

var str2 = { "name": "cxh", "sex": "man" };

要使用上面的str1,必须使用下面的方法先转化为JSON对象:

//由JSON字符串转换为JSON对象

var obj = eval('(' + str + ')');

或者

var obj = str.parseJSON(); //由JSON字符串转换为JSON对象

或者

var obj = JSON.parse(str); //由JSON字符串转换为JSON对象

然后,就可以这样读取:

Alert(obj.name);

Alert(obj.sex);

特别注意:如果obj本来就是一个JSON对象,那么使用eval()函数转换后(哪怕是多次转换)还是JSON对象,但是使用parseJSON()函数处理后会有问题(抛出语法异常)。

 

2. 将json对象转成字符串

最近写了一个表单里面要存的一个字段是使用json字符串格式存的,从数据库里面取下来的时候用的倒是挺爽,可是要存就有点麻烦了,当时一下子没有想到,后来去百度了一下,结果搜到的是用正则来拼接的,感觉挺麻烦的。随后跟别人讨论的过程中突然就想到了这样的办法,方法本身挺简单的,就只是网上搜不到,一下子也没想到罢了,这里做个记录,各位看着觉得简单也就见笑了。

<script>
    var jsonObj = {
        "qq":"321321321",
        "MSN":"asdf@asdf.com",
        "Tel":"0852-8888888"
    };
    var jStr = "{ ";
    for(var item in jsonObj){
        jStr += "'"+item+"':'"+jsonObj[item]+"',";
    }
    jStr += " }";
    alert(jStr);
</script>

除此之外还可以使用toJSONString()或者全局方法JSON.stringify()将JSON对象转化为JSON字符串。

例如:

var last=obj.toJSONString(); //将JSON对象转化为JSON字符

或者

var last=JSON.stringify(obj); //将JSON对象转化为JSON字符

 

3.json与数组互转

//数组转json串
var arr = [1,2,3, { a : 1 } ];
JSON.stringify( arr );

//json字符串转数组
var jsonStr = '[1,2,3,{"a":1}]';
JSON.parse( jsonStr );

 

4、遍历JSON对象和JSON数组

1、遍历JSON对象代码如下:

var packJson  = {"name":"Liza", "password":"123"} ;  
  
for(var k in packJson ){//遍历packJson 对象的每个key/value对,k为key  
   alert(k + " " + packJson[k]);  
}  

2、遍历JSON数组代码如下:

var packJson = [{"name":"Liza", "password":"123"}, {"name":"Mike", "password":"456"}];  
  
for(var i in packJson){//遍历packJson 数组时,i为索引  
   alert(packJson[i].name + " " + packJson[i].password);  
}

 

5.将两个JSON对象组装到一个里面

函数如下:

//targetJson 目标JSON,packJson 被组装JSON

function addGroupJson(targetJson, packJson){

    if(targetJson && packJson){

       for(var p in packJson){

           targetJson[p] = packJson[p];

       }

    }

}

用法如下:

var json1 = {"name":"nikita"};
var json2 = {"password":"1111"};
addGroupJson(json1, json2);
alert(json2str(json1));

 

6.js递归处理json

<script>
    $(document).ready(function() {
        var jsonStr = "{'name': 'cxh', 'sex': 'man', 'age': 1}";
        var obj = eval('(' + jsonStr + ')');
        var traverseJson="{ 'name': 'cxh', 'sex': 'man', 'age': 1},解析结果:</br>";
        for(var a in obj) {
            traverseJson += "key: " + a +",value: " + obj[a]+" </br> ";
        }
        $("#traverseJson").html(traverseJson);
        var arrayStr = [{"name":"运维管理","tId":"roleMenu0_1","children":[{"name":"权限管理","tId":"roleMenu0_2","children":[{"name":"角色管理","tId":"roleMenu0_3"},{"name":"用户管理","tId":"roleMenu0_4"}]},{"name":"菜单分配","tId":"roleMenu0_5"}]}];
        var str = "";
        f(arrayStr, str);
    });
    
    function f(array, str) {
        str += "--";
        for (var i = 0; i < array.length; i++) {
            var object = array[i];
            if (object.children) {
                $("#traverseArray").append(str + object.name +" </br> ");
                f(object.children, str);
            } else {
                $("#traverseArray").append(str + object.name +" </br> ");
            }
        }
    }
</script>

 

7.在Javascript操作JSON对象,增加 删除 修改

<script type="text/javascript">
    var jsonObj2 = { teacher: [
        { name: "jordan", sex: "m", age: "40" },
        { name: "bryant", sex: "m", age: "28" },
        { name: "McGrady", sex: "m", age: "27" }
    ]};

    var jsonObj2New = {};
    $("#btn").click(function () {
        //invoke the update
        updateData("jordan");
        var persons = jsonObj2.teacher;
        for (var i = 0; i < persons.length; i++) {
            var cur_person = persons[i];
            alert(cur_person.sex);
        }

        //invoke the delete
        deleteData("jordan");
        var persons = jsonObj2.teacher;
        for (var i = 0; i < persons.length; i++) {
            var cur_person = persons[i];
            alert(cur_person.sex);
        }

        //push 
        var temp = { name: "kenny", sex: "m", age: "25" };
        jsonObj2.teacher.push(temp);

        var persons = jsonObj2.teacher;
        for (var i = 0; i < persons.length; i++) {
            var cur_person = persons[i];
            alert(cur_person.name);
        }

    });

    function updateData(name) {
        var persons = jsonObj2.teacher;
        //alert(name);
        for (var i = 0; i < persons.length; i++) {
            var cur_person = persons[i];
            if (cur_person.name == name) {
                persons[i].sex = "f";
            }
        }
    }

    function deleteData(name) {
        var persons = jsonObj2.teacher;
        //alert(name);
        for (var i = 0; i < persons.length; i++) {
            var cur_person = persons[i];
            if (cur_person.name == name) {
                jsonObj2.teacher.splice(i, 1);
            }
        }
    }
    </script>

原文地址:http://www.manongjc.com/article/2162.html

上一篇:分享php多文件上传实现源码

下一篇:已是最后一篇