JSON.stringify详解

谁把年华错落成诗

April 26, 2018

1526 views

No comments

3650 words

JavaScript

语法说明

语法：JSON.stringify(value [, replacer] [, space])

参数说明

value：必选参数，就是你输入的对象，比如数组，类等
replacer：可选。它又分为2种方式，一种是数组，第二种是方法
①replacer为数组时，它是和第一个参数value有关系的。一般来说，系列化后的结果是通过键值对来进行表示的。所以，如果此时第二个参数的值在第一个存在，那么就以第二个参数的值做key，第一个参数的值为value进行表示，如果不存在，就忽略。
②replacer为方法时，就是说把系列化后的每一个对象传进方法里面进行处理。
space：可选，用什么来做分隔符。
①如果省略的话，那么显示出来的值就没有分隔符，直接输出来
②如果是一个数字的话，那么它就定义缩进几个字符，当然如果大于10 ，则默认为10，因为最大值为10
③如果是一些转义字符，比如“\t”，表示tab，那么它每行一个tab
④如果仅仅是字符串，就在每行输出值的时候把这些字符串附加上去，最大长度也是10个字符

操作实例

只有第一个参数value

var student = new Object(); 
student.name = "Lanny"; 
student.age = "25"; 
student.location = "China"; 
var json = JSON.stringify(student); 
console.log(json); 
//{"name":"Lanny","age":"25","location":"China"}

有些人可能会怀疑JSON.stringify的作用。那假如，我们不要这个函数，而直接打印student，结果如下：

var student = new Object(); 
student.name = "Lanny"; 
student.age = "25"; 
student.location = "China";
console.log(student); 
//Object {name: "Lanny", age: "25", location: "China"}

含有第二个参数replacer

第一个参数是Array，第二个参数是function

var students = new Array() ; 
students[0] = "onepiece"; 
students[1] = "naruto"; 
students[2] = "bleach"; 
var json = JSON.stringify(students,switchUpper); 
function switchUpper(key, value) { 
    return value.toString().toUpperCase(); 
} 
console.log(json); 
//"ONEPIECE,NARUTO,BLEACH"

下面这种方式也可以

var students = new Array() ; 
students[0] = "onepiece"; 
students[1] = "naruto"; 
students[2] = "bleach"; 
var json = JSON.stringify(students,function(key, value){ 
    return value.toString().toUpperCase(); 
}); 
console.log(json); 
//"ONEPIECE,NARUTO,BLEACH"

根据打印结果得知：每个值都传入了函数中处理

两个个参数都是Array

var stuArr1 = new Array() ; 
stuArr1[0] = "onepiece"; 
stuArr1[1] = "naruto"; 
stuArr1[2] = "bleach"; 
var stuArr2 = new Array(); 
stuArr2[0] = "1"; 
stuArr2[1] = "2"; 
var json = JSON.stringify(stuArr1,stuArr2)
console.log(json);
//["onepiece","naruto","bleach"]

根据打印结果得知：第二个参数被忽略了，只是第一个参数被系列化了

第一个参数是Object，第二个参数是Array

var stuObj = new Object(); 
stuObj.id = "20122014001"; 
stuObj.name = "Tomy"; 
stuObj.age = 25; 
var stuArr = new Array(); 
stuArr[0] = "id"; 
stuArr[1] = "age"; 
stuArr[2] = "addr"; 
var json = JSON.stringify(stuObj,stuArr); 
console.log(json);
//{"id":"20122014001","age":25}

根据打印结果得知：此函数根据数组内的值过滤了对象

含有第三个参数space

笔者以下实例将第二个参数设为null，即单独启用第三个参数作为示范

第三个参数为数字1000

var stuObj = new Object(); 
stuObj.id = "20122014001"; 
stuObj.name = "Tomy"; 
stuObj.age = 25; 
var json = JSON.stringify(stuObj,null,1000);
console.log(json);
//{
//          "id": "20122014001",
//          "name": "Tomy",
//          "age": 25
//}

第三个参数为转义字符"\t"

var stuObj = new Object(); 
stuObj.id = "20122014001"; 
stuObj.name = "Tomy"; 
stuObj.age = 25; 
var json = JSON.stringify(stuObj,null,"\t");
console.log(json);
//{
//    "id": "20122014001",
//      "name": "Tomy",
//      "age": 25
//}

第三个参数为字符串"OK"

var stuObj = new Object(); 
stuObj.id = "20122014001"; 
stuObj.name = "Tomy"; 
stuObj.age = 25; 
var json = JSON.stringify(stuObj,null,"OK");
console.log(json);
//{
//OK"id": "20122014001",
//OK"name": "Tomy",
//OK"age": 25
//}

参考资料：JSON.stringify 语法实例讲解