JSON.stringify()详解

首先，一句话概括重点：JSON.stringify()就是将js对象转换为JSON字符串。

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

参数说明：

value：

必须字段，一个有效的JSON字符串，可以是对象、数组等。

举个栗子：

var before = {"name": "bunny", "age": 18, "boyfriend": "bunnylover"};
var after = JSON.stringify(before);
alert(after);

再来看一下直接alert(before)的结果：

replacer：

可选字段，用于转换第一个参数（即目标JSON字符串）的函数或数组。这个参数用法有点多

value为数组，且replacer为方法的情况：

这个方法将被调用，传入的参数是JSON字符串的键和值，最后使用的是这个方法的返回值而不再是原始的键和值。形象来说这就是加工厂，把目标JSON字符串扔进来对每个键值对进行处理，使用处理之后的结果。

举个栗子：（当然，这里的匿名function可以提出来写为独立方法）

var before = ["I","love","bunny"];
var after = JSON.stringify(before, function(key, value) {
   return value.toString().toUpperCase();
});
alert(after);

那么最后alert得到的结果为：

看一下alert(before)的结果：

注意：

当一个键值对通过方法返回undefined时，排除此键值对，不显示出来。

根对象的键是一个空字符串：""。即return key.toString(); 得到""。

value为对象，且replacer为数组的情况：

JSON字符串中的键将与replacer数组中的值进行比对，将存在于replacer数组中的键值保留，并按照replacer数组中的顺序排列。也可以理解为将两者进行比对，遇到能匹配的项，则用replacer数组中的值作为键，value中的值作为值，组成新的键值对，得到新的对象。

可能不太好理解，直接上栗子：

var before = {"name": "bunny", "age": 18, "boyfriend": "bunnylover"};
var after = JSON.stringify(before, ["age","name","pet"]);
alert(after);

得到结果为：

这样就很明了了，我们可以用它来对JSON对象的属性按需要进行筛选、排序后输出。

value为数组，且replacer也为数组的情况：

replacer数组将被忽略，和只有一个value参数的情况一样。

总结：

value为数组形式时，replacer用方法对数组项进行加工。

value为对象形式时，replacer用数组进行筛选与排序。

space：

即每个属性的分隔符。

省略的话则结果直接按一行输出：

栗子：

var before = {"name": "bunny", "age": 18, "boyfriend": "bunnylover"};
var after = JSON.stringify(before);
alert(after);

数字的情况，数字代表空格数，最大为10，大于10也只显示10个空格：

栗子：

var before = {"name": "bunny", "age": 18, "boyfriend": "bunnylover"};
var after = JSON.stringify(before,["age","name","boyfriend"],12);
alert(after);

转义字符的情况：例如制表符\t，回车\r等。

栗子：

var before = {"name": "bunny", "age": 18, "boyfriend": "bunnylover"};
var after = JSON.stringify(before,["age","name","boyfriend"],"\t");
alert(after);

字符串的情况：很简单，自然是在每一个属性前加上字符串。

栗子：

var before = {"name": "bunny", "age": 18, "boyfriend": "bunnylover"};
var after = JSON.stringify(before,["age","name","boyfriend"],"qwer");
alert(after);

猜你喜欢