JSON.stringify() 字符串化
JSON.stringify()
JSON 的常规用途是同 web 服务器进行数据交换。
在向 web 服务器发送数据时,数据必须是字符串。
通过 JSON.stringify()
把 JavaScript 对象转换为字符串。
对 JavaScript 对象进行字符串化
想象一下我们在 JavaScript 中有这个对象:
var obj = { name:"Bill Gates", age:62, city:"Seattle"};
请使用 JavaScript 函数 JSON.stringify()
将它转换为字符串。
var myJSON = JSON.stringify(obj);
结果将是遵守 JSON 标记法的一段字符串。
myJSON 目前是一段字符串,并准备好送往服务器:
示例代码:
var obj = { name:"Bill Gates", age:62, city:"Seattle"};
var myJSON = JSON.stringify(obj);
document.getElementById("demo").innerHTML = myJSON;
完整实例:
<!DOCTYPE html>
<html>
<body>
<h1>从 JavaScript 对象创建 JSON 字符串</h1>
<p id="demo"></p>
<script>
var obj = { name: "Bill", age: 62, city: "Seatle" };
var myJSON = JSON.stringify(obj);
document.getElementById("demo").innerHTML = myJSON;
</script>
</body>
</html>
运行结果:
从 JavaScript 对象创建 JSON 字符串 {"name":"Bill","age":62,"city":"Seatle"}
可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html
您将在下一章学到如何向服务器发送 JSON。
Stringify JavaScript 数组
也可以对 JavaScript 数组进行字符串化:
想象一下我们在 JavaScript中有这个数组:
var arr = [ "Bill Gates", "Steve Jobs", "Elon Musk" ];
请使用 JavaScript 函数 JSON.stringify()
将其转换为字符串。
var myJSON = JSON.stringify(arr);
结果将是遵守 JSON 标记法的字符串。
myJSON 目前是一段字符串,并准备好送往服务器:
示例代码:
var arr = [ "Bill Gates", "Steve Jobs", "Elon Musk" ];
var myJSON = JSON.stringify(arr);
document.getElementById("demo").innerHTML = myJSON;
完整实例:
<!DOCTYPE html>
<html>
<body>
<h1>用 JavaScript 数组创建 JSON 字符串</h1>
<p id="demo"></p>
<script>
var arr = [ "Bill Gates", "Steve Jobs", "Elon Musk" ];
var myJSON = JSON.stringify(arr);
document.getElementById("demo").innerHTML = myJSON;
</script>
</body>
</html>
运行结果:
用 JavaScript 数组创建 JSON 字符串 ["Bill Gates","Steve Jobs","Elon Musk"]
可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html
您将在下一章学到如何向服务器发送 JSON。
例外
日期字符串化
在 JSON 中,不允许日期对象。JSON.stringify()
函数将把任何日期转换为字符串。
实例
var obj = { "name":"Bill Gates", "today":new Date(), "city":"Seattle"};
var myJSON = JSON.stringify(obj);
document.getElementById("demo").innerHTML = myJSON;
完整实例:
<!DOCTYPE html>
<html>
<body>
<h1>JSON.stringify 会把任何日期对象转换为字符串</h1>
<p id="demo"></p>
<script>
var obj = { name: "Bill Gates", today: new Date(), city: "Seattle" };
var myJSON = JSON.stringify(obj);
document.getElementById("demo").innerHTML = myJSON;
</script>
</body>
</html>
运行结果:
JSON.stringify 会把任何日期对象转换为字符串 {"name":"Bill Gates","today":"2022-05-25T09:58:45.116Z","city":"Seattle"}
可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html
您可以在接收端把字符串转换回日期对象。
函数字符串化
在 JSON 中,不允许函数作为对象值。
JSON.stringify()
函数将从 JavaScript 对象删除任何函数,包括键和值:
示例代码:
var obj = { "name":"Bill Gates", "age":function () {return 62;}, "city":"Seattle"};
var myJSON = JSON.stringify(obj);
document.getElementById("demo").innerHTML = myJSON;
完整实例:
<!DOCTYPE html>
<html>
<body>
<h1>JSON.stringify 会删除对象中的任何函数</h1>
<p id="demo"></p>
<script>
var obj = { name: "Bill Gates", age: function () {return 62;}, city: "Seattle" };
var myJSON = JSON.stringify(obj);
document.getElementById("demo").innerHTML = myJSON;
</script>
</body>
</html>
运行结果:
JSON.stringify 会删除对象中的任何函数 {"name":"Bill Gates","city":"Seattle"}
可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html
如果您在运行 JSON.stringify()
函数前已将函数转换为字符串,这个环节可以省略。
示例代码:
var obj = { "name":"Bill Gates", "age":function () {return 62;}, "city":"Seattle"};
obj.age = obj.age.toString();
var myJSON = JSON.stringify(obj);
document.getElementById("demo").innerHTML = myJSON;
完整实例:
<!DOCTYPE html>
<html>
<body>
<h1>JSON.stringify 会删除对象中的任何函数</h1>
<p>把函数转换为字符串,就可以在 JSON 对象中保留该函数。</p>
<p id="demo"></p>
<script>
var obj = { name: "Bill Gates", age: function () {return 62;}, city: "Seattle" };
obj.age = obj.age.toString();
var myJSON = JSON.stringify(obj);
document.getElementById("demo").innerHTML = myJSON;
</script>
</body>
</html>
运行结果:
JSON.stringify 会删除对象中的任何函数 把函数转换为字符串,就可以在 JSON 对象中保留该函数。 {"name":"Bill Gates","age":"function () {return 62;}","city":"Seattle"}
可以使用本站在线JavaScript测试工具测试上述代码运行效果:http://www.phpcodeweb.com/runjs.html
您应该避免在 JSON 中使用函数,函数会失去其作用域,而且您还需要使用 eval()
将它们转换回函数。
浏览器支持
所有主流浏览器和最新的 ECMAScript (JavaScript) 标准都包含 JSON.stringify()
函数:
下表中的数字指定了完全支持 JSON.stringify()
函数的首个浏览器版本:
Yes | 8.0 | 3.5 | 4.0 | 10.0 |