javascript 跳跃式前进 (3) - 跳入 JSON

简介: 早期的解析只有用eval() ,但是这货太容易给注入恶意代码…之后就有人写了个JSON2.js来让低级浏览器支持JSONES5开始,就出现了相应的规范来和函数处理JSON对象[stringify()和parse()];


前言


JSON崛起不是意外,是顺应时代;相当简洁小巧的书写模式及阅读方式;


基础


看这篇文章: JSON知识点汇总_W3SCHOOL


初步进阶


早期的解析只有用eval() ,但是这货太容易给注入恶意代码…之后就有人写了个JSON2.js来让低级浏览器支持JSON

ES5开始,就出现了相应的规范来和函数处理JSON对象[stringify()和parse()];


值得一提的是:


1. 每个属性名都必须用双引号,否则会抛出异常!!!

2. JSON数组的格式为字面量格式

3. 每个值键对后面若是还有值键对,应该以逗号隔开


  • stringify() : 把javascript对象序列化为字符串


var person = {
    "name" :"CRPER",
    "age" : 24,
    "Interesting" :['reading','play'] 
}
var person_str = JSON.stringify(person);   //这一步就是把JSON对象转为相应的字符串
console.log(person_str);   //打印值 : {"name":"CRPER","age":24,"Interesting":["reading","play"]}
console.log(typeof person_str);   //打印值: "string"
/*
 过滤:第二个参数(riviver)支持传入一个数组或者一个函数来过滤整个json对象不需要的属性和值
 默认需要返回自身value[就是条件不成立的时候]
*/
var person1 = JSON.stringify(person,["age","Interesting"]);
console.log(person1);  //打印值:{"age":24,"Interesting":["reading","play"]}
var person2 = JSON.stringify(person,function(key,value){
   switch(key){
       case "name" :return  value + "LIN";
       case "age":return  parseInt(value) + 1;
       default : return value;
   }
})
console.log(person2);   //打印值: "{"name":"CRPERLIN","age":25,"Interesting":["reading","play"]}"
var person2 = JSON.stringify(person,function(key,value){
   if(key == "name"){
     return "LIN" + value;
   }else if(key == "age"){
      return 10+value;
   }
   else{
      return value
   }
})
console.log(person2);  //打印值: "{"name":"LINCRPER","age":34,"Interesting":["reading","play"]}"
/*缩进:第三个参数是控制缩进的,最大的缩进为10个字符*/
var person3 = JSON.stringify(person,null,4);
console.log(person3);
/*
"{
    "name": "CRPER",
    "age": 24,
    "Interesting": [
        "reading",
        "play"
    ]
}"
*/
/*
 toJSON方法,函数过滤器的补充;
 1. 若对象内有toJSON,则优先执行,无则返回自身;
 2. 若作为第二个参数传入,则对函数进行过滤
*/
var book = {
   "title" : "JS大神进阶记",
   "page_total":999,
   "money":99,
   "copyright":"CRPER",
   toJSON:function(){
       return this.title;
  }
}
var test = JSON.stringify(book);   
console.log(test);      //打印值:""JS大神进阶记""
var test2 = JSON.stringify(book,function(key,value){
    console.log(value) ;   //JS大神进阶记
});


//接着上面的例子;
  var parseJSON = JSON.parse(person_str);     //把符合书写规范的字符串转为对象
  console.log(parseJSON);    //打印值:  Object {name: "CRPER", age: 24, Interesting: Array[2]}


总结


JSON的值可以表现为这么多种:


1. string

2. number

3. object

4. array

5. true

6. false

7. null

目录
相关文章
|
1月前
|
JSON JavaScript 前端开发
JavaScript原生代码处理JSON的一些高频次方法合集
JavaScript原生代码处理JSON的一些高频次方法合集
|
4月前
|
XML JSON JavaScript
|
4月前
|
JSON JavaScript 前端开发
JavaScript 如何对 JSON 数据进行冒泡排序?
JavaScript 如何对 JSON 数据进行冒泡排序?
52 0
|
5月前
|
JSON JavaScript 前端开发
前端 ex2json 用于 vue/react/js 将 xls、xlsx、csv 文件转成 json 数组
前端 ex2json 用于 vue/react/js 将 xls、xlsx、csv 文件转成 json 数组
97 0
|
5月前
|
JSON JavaScript API
Node.js(nodejs)对本地JSON文件进行增、删、改、查操作(轻车熟路)
Node.js(nodejs)对本地JSON文件进行增、删、改、查操作(轻车熟路)
|
5月前
|
JSON JavaScript 数据格式
JS 将 json 对象转成字符串并保留格式 - JSON.stringify()
JS 将 json 对象转成字符串并保留格式 - JSON.stringify()
66 0
|
3月前
|
JSON JavaScript 前端开发
Python之JavaScript逆向系列——接口JSON信息获取与操作
Python之JavaScript逆向系列——接口JSON信息获取与操作
56 0
|
4月前
|
JSON JavaScript Android开发
JS生成JSON字符串---autojs pro 篇
JS生成JSON字符串---autojs pro 篇
36 0
|
4月前
|
JSON 资源调度 JavaScript
Node.js专题讲解 第2期 package.json
Node.js专题讲解 第2期 package.json
58 0
|
4月前
|
JSON 前端开发 JavaScript
将 JavaScript 对象或值转换为 JSON 字符串:JSON.stringify()
将 JavaScript 对象或值转换为 JSON 字符串:JSON.stringify()
73 3