• 1.6 JSON存储数据方式(JavaScript对象表示法)


    1.6 JSON存储数据方式(JavaScript对象表示法)

    JSON JavaScript 对象表示法(JavaScript Object Notation) 是一种存储数据的方式。

    一、创建JSON对象

    var gareen = {"name":"盖伦","hp":616}; 
    这样就创建了一个JSON 对象 
    JSON对象由 名称/值对组成 名称和值之间用冒号:隔开 
    名称必须用双引号" 包含起来 
    值可以是任意javascript数据类型,字符串,布尔,数字 ,数组甚至是对象 
    不同的名称/值对之间用 逗号 , 隔开

    <script>
    var gareen = {"name":"盖伦","hp":616};
      
    document.write("这是一个JSON对象: "+gareen);
     </script>
    //运行结果
    这是一个JSON对象: [object Object]

    1.2、访问JSON节点

    直接gareen.name访问JSON对象的属性

    直接gareen.hp访问JSON对象的属性

    二、通过方括号[] 创建JSON 数组

    <script>
    //通过方括号[] 创建JSON 数组
    var heros=
    [
        {"name":"盖伦","hp":616},
        {"name":"提莫","hp":313},
        {"name":"死歌","hp":432},
        {"name":"火女","hp":389}
    ]
     //length个数
    document.write("JSON数组大小"+heros.length);
    //访问JSON数组和访问普通数组一样,通过下标访问
    document.write( "第4个英雄是:" +  heros[3].name);
    </script>

    三、JSON对象转换问题

    3.1JSON对象与JavaScript对象

    JavaScript对象 分内置对象(Number,String,Array,Date,Math)和自定义对象 
    JSON就是自定义对象,只不过是以JSON这样的数据组织方式表达出来 
    所以不存在JSON对象与JavaScript对象的转换问题

    3.2字符串转为JSON对象

    通过字符串拼接得到一个JSON结构的字符串,并不是一个JSON对象。 需要通过eval转换得到
    转换的时候注意,eval 函数要以 开头,结尾
    或者使用JQuery的$.parseJSON转换函数

    <script src="http://how2j.cn/study/jquery.min.js"></script>
    <script>
    var s1 = "{"name":"盖伦"";
    var s2 = ","hp":616}";
    var s3 = s1+s2;
      
    document.write("这是一个JSON格式的字符串:" + s3);
    document.write("<br>");
    //1.使用JQuery的$.parseJSON转换函数
    var gareen1 = $.parseJSON(s3);
    document.write("这是一个JSON对象: " + gareen1);
    document.write("<br>");
    //2.使用eval方法
    var gareen2 = eval("("+s3+")");
    document.write("这是一个JSON对象: " + gareen2);
    </script>

    3.3  JSON转换为字符串

    json 对象因为是一个javascript对象,所以如果直接打印的话,看不到里面的内容。需要通过 JSON.stringify 函数把它转换为 字符串

    <script>
    var hero = {"name":"盖伦","hp":"616"};
    document.write("这是一个json 对象:"+ hero);
    document.write("<br>");
    var heroString = JSON.stringify(hero)
    document.write("这是一个json 字符串:"+ heroString );
    </script>

    四、实际开发中的使用

  • 相关阅读:
    开源图标字体 uiw-iconfont v1.2.6 发布,新增图标
    OAuth授权登录
    网站视觉设计规范
    LOGO有哪几种常规设计思路?
    Web设计规范----控件、组件
    前端工程师的新选择WebApp
    openstack学习-网络管理 (转)
    理解OpenStack与SDN控制器的集成(转)
    NFV MANO 架构
    Raid 磁盘阵列
  • 原文地址:https://www.cnblogs.com/Smileing/p/11552961.html
Copyright © 2020-2023  润新知