js中JSON的解析(将json字符串转化为对象)和序列化(将对象转化为json字符串)(函数的功能一般都挺全的,需要的时候去查看完整函数)

时间:2022-07-01 08:09:20

js中JSON的解析(将json字符串转化为对象)和序列化(将对象转化为json字符串)(函数的功能一般都挺全的,需要的时候去查看完整函数)

一、总结

1、JSON解析:JSON.parse(myJSONtext);

2、JSON序列化:JSON.stringify(myObject);

3、一般函数的功能都很全,很多我们不常用的功能都有,可选参数,需要特殊功能的时候去查完整的函数

二、js中JSON的解析(将json字符串转化为对象)和序列化(将对象转化为json字符串)

JSON 的解析和序列化

一般情况下,我们的json数据都是从服务端获取到的,获取的json数据是以字符串的形式返回的。这个字符串虽然是json格式的,但是不能被直接使用,我们必须将该字符串转化为一个对象才能正常解析它

  • JavaScript 函数 eval() 可用于将 JSON 文本转换为 JavaScript 对象。

    eval()函数可编译并执行任何 JavaScript 代码。这隐藏了一个潜在的安全问题。(如果JSON中包含恶意代码也会被直接执行)

  • 使用 JSON 解析器将 JSON 转换为 JavaScript 对象是更安全的做法。JSON解析器只会识别JSON文本,而不会执行。
    • JSON 的解析:json数据转换成js对象

      语法:var myObject = JSON.parse(myJSONtext, reviver);

    • JSON的序列化:js对象转换成json数据(字符串)

      语法:var myJSONText = JSON.stringify(myObject, replacer);

对于较老的浏览器,可使用 JavaScript 库: https://github.com/douglascrockford/JSON-js

三、代码

json解析

 <!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<title>课堂演示</title>
</head>
<body>
<script>
//实际使用的时候json数据需要从服务器加载,这里假定下面的数据是从服务器加载过来的,来演示后续的操作。
var jsonstr='[{"name":"aaa","age":30},{"name":"bbb","age":25},{"name":"ccc","age":18}]';
//alert(typeof(jsonstr))
//json数据转换成js对象
//var jsonobj=JSON.parse(jsonstr);
//alert(jsonstr)
// alert(jsonobj[0].name)
//alert(typeof(jsonobj)) var jsonobj=JSON.parse(jsonstr,function(key,value){ //1、第二个参数,解析式时替换
if ((key=='name')) {
return 'VIP会员:'+value;
}else{return value}
}); alert(jsonobj[0].age)
</script>
</body>
</html>

json序列化

 <!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<title>课堂演示</title>
</head>
<body>
<script>
var jsonobj=[ //2、json对象
{
name:'aaa',
age:30,
lv:2
},
{
name:'bbb',
age:25,
lv:1
}
] //alert(jsonobj[0].name+'\n'+jsonobj[0].age+'\n'+jsonobj[0].lv) // var jsonstr=JSON.stringify(jsonobj)
// alert(typeof(jsonobj))
// alert(typeof(jsonstr)) //第二个参数
// var jsonstr=JSON.stringify(jsonobj,['name','lv'])
// alert(jsonstr)
// var jsonstr=JSON.stringify(jsonobj,function(key,value){
// if (key=='lv') {
// return '等级为:'+value
// }else{return value}
// })
// alert(jsonstr) //第三个参数表示缩进
var jsonstr=JSON.stringify(jsonobj,null,4) //3、函数还有其余参数
alert(jsonstr)
</script>
</body>
</html>