zoukankan      html  css  js  c++  java
  • 2.10 学习总结 之 JQ加强

    一、说在前面

     昨天 完成了体温统计APP的编写
    今天 学习json数据结构

    二、学习总结

    1、json数据结构

    1)什么是json:

      JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。它基于ECMAScript的一个子集。 JSON采用完全独立于语言的文本格式,但是也使用了类似于C语言家族的习惯。这些特性使JSON成为理想的数据交换语言。易于人阅读和编写,同时也易于机器解析和生成(一般用于提升网络传输速率)。

    2)json的数据格式(json的结构有两种结构)

    第一种:对象结构:对象在js中表示为“{}”括起来的内容,数据结构为 {key:value,key:value,...}的键值对的结构,在面向对象的语言中,key为对象的属性,value为对应的属性值,key的类型为字符串,value的类型可以是 数字、字符串、数组、对象几种。

    示例:描述一个用户:  {"id":100,"username":"张三","age":28,"addr":"天津"}

    第二种:数组结构:数组在js中是中括号“[]”括起来的内容,数据结构为 ["java","javascript","vb",...],取值方式和所有语言中一样,使用索引获取,字段值的类型可以是 数字、字符串、数组、对象几种。

    (注意:在实际开发中,对象结构和数组结构会相互嵌套,相互包含)

    3)json的转换工具

      在实际的开发中,我j们经常会使用json串作为数据传输的载体,例如浏览器端页面中的js与服务端的数据交互,android/ios移动端与服务端的数据交互都大量使用json,但发现使用java代码手动拼接json串是一个很耗时很繁琐的事情,所以一批json的自动转换的工具出现了。即可以自动的将对象、数组、集合等转换成json串,也可以将一个json串转成对象、数组和集合。

    4)常用的转换工具:

    1> jsonlib:是一个java类库,开发时需要导入6个jar包

    commons-beanutils-1.8.3.jar
    commons-collections-3.2.1.jar
    commons-lang-2.6.jar
    commons-logging-1.1.1.jar
    ezmorph-1.0.6.jar
    json-lib-2.4-jdk15.jar

    2>  Gson:google的产品 很多企业都在使用  (我也在用)

    3> FastJson:阿里巴巴技术团队的产品 号称是最快的json转换工具

     三、案例演示

    1、单个对象

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <title>json01</title>
        <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
        <meta http-equiv="description" content="this is my page">
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
      </head>
      <body>
           <ul>
             <li id="bj" name="beijing">北京</li>
           </ul>
      </body>
      
      <script language="JavaScript">
        /**
         * 案例一
         *  {key:value,key:value}
         *  
         * class Person{
         *       String firstname = "张";
         *    String lastname = "三丰";
         *    Integer age = 100;
         * }
         * 
         * Person p = new Person();
         * System.out.println(p.firstname);
         */
        
        var person = {"firstname":"","lastname":"三丰","age":100};
         
         //取出lastname
         alert(person.lastname);
         //取出age
         alert(person.age);
        
        
    
      </script>
    </html>

     

     2、数组

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <title>insertBefore.html</title>
        <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
        <meta http-equiv="description" content="this is my page">
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
      </head>
      <body>
           <ul>
             <li id="bj" name="beijing">北京</li>
           </ul>
      </body>
      
      <script language="JavaScript">
       /**
         * 案例四
         * {
         *   "param1":[{key:value,key:value},{key:value,key:value}],
         *   "param2":[{key:value,key:value},{key:value,key:value}],
         *   "param3":[{key:value,key:value},{key:value,key:value}]
         * }
         *  
         *  
         */
         var json = {
                         "baobao":[
                                       {"name":"小双","age":28,"addr":"扬州"},
                                       {"name":"建宁","age":18,"addr":"紫禁城"},
                                       {"name":"阿珂","age":10,"addr":"山西"},
                                   ],
                          "haohao":[
                                       {"name":"张爽","age":25,"addr":"吉林"},
                                       {"name":"舒洁","age":23,"addr":"赤峰"}
                                   ]
                     };
         
        alert(json.haohao[1].name);
         
    
      </script>
    </html>

     3、数组对象混合

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <title>insertBefore.html</title>
        <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
        <meta http-equiv="description" content="this is my page">
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
      </head>
      <body>
           <ul>
             <li id="bj" name="beijing">北京</li>
           </ul>
      </body>
      
      <script language="JavaScript">
         /**
         * 案例五
         * {
         *   "param1":"value1",
         *   "param2":{},
         *   "param3":[{key:value,key:value},{key:value,key:value}]
         * }
         *  
         *  
         */
         
         var json = {
                "key1":"value1",
                "key2":{"firstname":"","lastname":"三丰","age":100},
                "key3":[
                           {"name":"小双","age":28,"addr":"扬州"},
                           {"name":"建宁","age":18,"addr":"紫禁城"},
                           {"name":"阿珂","age":10,"addr":"山西"},
                       ]
         };
         
         alert(json.key2.lastname);
         
         alert(json.key3[2].name);
         
         
      </script>
    </html>

     

  • 相关阅读:
    apache的并发
    PHP 文件上传
    打包备份3天
    dz改写CSS
    linux cifs自动挂载远程windows硬盘或文件夹
    C++面向对象
    "i++"和"++i"
    《程序员面试宝典》一个程序
    《程序员面试宝典》强制转换,内存地址
    《程序员面试宝典》编程技巧--位运算
  • 原文地址:https://www.cnblogs.com/20183544-wangzhengshuai/p/12289849.html
Copyright © 2011-2022 走看看