JSON.stringify()
JSON 的常规用途是同 web 服务器进行数据交换。
在向 web 服务器发送数据时,数据必须是字符串。
通过 JSON.stringify() 把 JavaScript 对象或值转换为 JSON 字符串。
语法
JSON.stringify(value[, replacer [, space]])
参数解释:
value,将要序列化成 一个 JSON 字符串的值。
replacer 可选,如果该参数是一个函数,则在序列化过程中,被序列化的值的每个属性都会经过该函数的转换和处理;如果该参数是一个数组,则只有包含在这个数组中的属性名才会被序列化到最终的 JSON 字符串中;如果该参数为 null 或者未提供,则对象所有的属性都会被序列化。
space 可选,指定缩进用的空白字符串,用于美化输出(pretty-print);如果参数是个数字,它代表有多少的空格;上限为10。该值若小于1,则意味着没有空格;如果该参数为字符串(当字符串长度超过10个字母,取其前10个字母),该字符串将被作为空格;如果该参数没有提供(或者为 null),将没有空格。
对 JavaScript 对象进行字符串化
比如我们在 JavaScript 中有这个对象:
var obj = { name:"埃隆 马斯克", age:50, city:"洛杉矶"};
请使用 JavaScript 函数 JSON.stringify() 将它转换为字符串。
var myJSON = JSON.stringify(obj);
结果将是遵守 JSON 标记法的一段字符串。
myJSON 目前是一段字符串,并准备好送往服务器:
<!DOCTYPE html>
<html>
<body>
<h1>从 JavaScript 对象创建 JSON 字符串</h1>
<p id="demo">
<script>
var obj = { name: "马斯克", age: 50, city: "洛杉矶" };
var myJSON = JSON.stringify(obj);
document.getElementById("demo").innerHTML = myJSON;
</script>
</body>
</html>
Stringify JavaScript 数组
也可以对 JavaScript 数组进行字符串化:
比如我们在 JavaScript中有这个数组:
var arr = [ "比尔 盖茨", "马克 扎克伯格", "埃隆 马斯克" ];
可以使用 JavaScript 函数 JSON.stringify() 将其转换为字符串。
var myJSON = JSON.stringify(arr);
结果将是遵守 JSON 标记法的字符串。
myJSON 目前是一段字符串,并准备好送往服务器:
<!DOCTYPE html>
<html>
<body>
<h1>用 JavaScript 数组创建 JSON 字符串</h1>
<p id="demo">
<script>
var arr = [ "比尔 盖茨", "马克 扎克伯格", "埃隆 马斯克" ];
var myJSON = JSON.stringify(arr);
document.getElementById("demo").innerHTML = myJSON;
</script>
</body>
</html>
例外
日期字符串化
在 JSON 中,不允许日期对象。JSON.stringify() 函数将把任何日期转换为字符串。
<!DOCTYPE html>
<html>
<body>
<h1>JSON.stringify 会把任何日期对象转换为字符串</h1>
<p id="demo">
<script>
var obj = { name: "埃隆 马斯克", today: new Date(), city: "洛杉矶" };
var myJSON = JSON.stringify(obj);
document.getElementById("demo").innerHTML = myJSON;
</script>
</body>
</html>
您可以在接收端把字符串转换回日期对象。
函数字符串化
在 JSON 中,不允许函数作为对象值。JSON.stringify() 函数将从 JavaScript 对象删除任何函数,包括键和值:
实例
<!DOCTYPE html>
<html>
<body>
<h1>JSON.stringify 会删除对象中的任何函数</h1>
<p id="demo">
<script>
var obj = { name: "埃隆 马斯克", age: function () {return 50;}, city: "洛杉矶" };
var myJSON = JSON.stringify(obj);
document.getElementById("demo").innerHTML = myJSON;
</script>
</body>
</html>
如果您在运行 JSON.stringify() 函数前已将函数转换为字符串,这个环节可以省略。
<!DOCTYPE html>
<html>
<body>
<h1>JSON.stringify 会删除对象中的任何函数</h1>
<p>把函数转换为字符串,就可以在 JSON 对象中保留该函数。</p>
<p id="demo">
<script>
var obj = { name: "埃隆 马斯克", age: function () {return 50;}, city: "洛杉矶" };
obj.age = obj.age.toString();
var myJSON = JSON.stringify(obj);
document.getElementById("demo").innerHTML = myJSON;
</script>
</body>
</html>
您应该避免在 JSON 中使用函数,函数会失去其作用域,而且您还需要使用 eval() 将它们转换回函数。
注意事项
- 转换值如果有 toJSON() 方法,该方法定义什么值将被序列化。
- 非数组对象的属性不能保证以特定的顺序出现在序列化后的字符串中。
- 布尔值、数字、字符串的包装对象在序列化过程中会自动转换成对应的原始值。
- undefined、任意的函数以及 symbol 值,在序列化过程中会被忽略(出现在非数组对象的属性值中时)或者被转换成 null(出现在数组中时)。函数、undefined 被单独转换时,会返回 undefined,如JSON.stringify(function(){}) or JSON.stringify(undefined).
- 对包含循环引用的对象(对象之间相互引用,形成无限循环)执行此方法,会抛出错误。
- 所有以 symbol 为属性键的属性都会被完全忽略掉,即便 replacer 参数中强制指定包含了它们。
- Date 日期调用了 toJSON() 将其转换为了 string 字符串(同Date.toISOString()),因此会被当做字符串处理。
- NaN 和 Infinity 格式的数值及 null 都会被当做 null。
- 其他类型的对象,包括 Map/Set/WeakMap/WeakSet,仅会序列化可枚举的属性。
浏览器支持
所有主流浏览器和最新的 ECMAScript (JavaScript) 标准都包含 JSON.stringify() 函数:
下表中的数字指定了完全支持 JSON.stringify() 函数的首个浏览器版本:
Yes | 8.0 | 3.5 | 4.0 | 10.0 |