• :在线测试工具暂时不可用,小伙伴们可以使用本地编辑器来代替,绿叶全新版本正在快马加鞭开发中,比心~

1.4 JSON对象和JSON字符串

一、普通字符串、JSON字符串和JSON对象

初学者经常有一个困惑,就是分不清普通字符串、JSON字符串和JSON对象。其实这3者是非常容易区分的。

1、普通字符串

字符串嘛,大家都知道是使用单引号或双引号括起来的一串字符。

举例:

 
var str = "绿叶学习网json教程";

2、JSON对象

JSON对象我们在“JSON对象结构”这一节已经详细为大家讲解了。JSON对象,指的是符合JSON格式要求的JavaScript对象。

举例:

 
var jsonObj = {"name":"helicopter","age":23,"gender":"男"};

3、JSON字符串

JSON字符串,指的是符合“JSON格式”的字符串。

JSON字符串要求两点:

(1)必须是字符串,也就是要用单引号或双引号括起来;

(2)必须符合“JSON”格式。

举例:

 
var jsonStr = '{"name": "helicopter", "age":23, "gender": "男"}';

JSON字符串说白了就是在JSON对象外面加一对单引号。

大家好好对比一下,就知道普通字符串、JSON对象和JSON字符串的区别了。

二、JSON对象转换为JSON字符串

在JSON中,可以使用JSON.stringify()方法将JSON对象转换为JSON字符串。

语法:

 
JSON.stringify(JSON对象名);

举例:

 
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript">
        var obj =
        {
            "name":"helicopter",
            "age":23,
            //JSON对象内部也有一个JSON对象
            hobby:
            {
                "first":"swimming",
                "second":"singing",
                "third":"dancing"
            }
        }
        var jsonStr=JSON.stringify(obj);
        document.write(jsonStr);
    </script>
</head>
<body>
</body>
</html>

在浏览器预览效果如下:

三、将JSON字符串转换为JSON对象

在JavaScript中,将JSON字符串转换为JSON对象非常有用。一般,在Web服务器后台向前台传输数据的过程中,往往都是用字符串形式来传输JSON数据。如果我们在前台想要获取JSON数据,就必须将JSON字符串转换为JSON对象才能操作。

现在大多数浏览器(IE8及以上,Chrome和Firefox差不多全部)自带原生JSON对象,提供JSON.parse()方法来将JSON字符串转换为JSON对象。

语法:

 
JSON.parse(字符串名); 

举例:

 
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript">
        var jsonStr = '{"name": "helicopter", "age":23, "gender": "男"}';
        var jsonObj=JSON.parse(jsonStr);
        document.write("姓名是:"+jsonObj.name);
    </script>
</head>
<body>
</body>
</html>

在浏览器预览效果如下:

:本站所有教程均为原创,大部分已经与人民邮电出版社合作出版,禁止转载和抄袭,否则绿叶学习网和人民邮电出版社必将追究法律责任,附录:互联网著作权保护法。【法律顾问:张俊律师】

小伙伴们也可以加一下QQ群,在“群文件”中可以获取学习资源以及配套资源,以及跟其他小伙伴交流,站长也在群内。

(1)QQ群:519225291(暗号:lvye

(2)绿叶学习网常见问题解答

回到顶部