• JSON学习总结


    JSON定义
    JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,易于阅读和编写,同时也易于机器解析和生成。

    JSON的结构基于下面两点

    • 1. "名称/值"对的集合 不同语言中,它被理解为对象(object),记录(record),结构(struct),字典(dictionary),哈希表(hash table),键列表(keyed list)等
    • 2. 值的有序列表 多数语言中被理解为数组(array)
    JSON使用

     这里假设我们需要创建一个User对象,并具有以下属性

  • 用户ID
  • 用户名
  • 用户Email

    您可以使用以下JSON形式来表示User对象:

    {"UserID":11, "Name":"Truly", "Email":"zhuleipro◎hotmail.com"};

    然后如果把这一字符串赋予一个JavaScript变量,那么就可以直接使用对象的任一属性了。

    完整代码:

    <script>
    var User = {"UserID":11, "Name":"Truly", "Email":"zhuleipro◎hotmail.com"}; alert(User.Name); </script>

    实际使用时可能更复杂一点,比如我们为Name定义更详细的结构,使它具有FirstName和LastName:

    {"UserID":11, "Name":{"FirstName":"Truly","LastName":"Zhu"}, "Email":"zhuleipro◎hotmail.com"}

    完整代码:

    <script>
    var User = {"UserID":11, "Name":{"FirstName":"Truly","LastName":"Zhu"}, "Email":"zhuleipro◎hotmail.com"}; alert(User.Name.FirstName); </script>

    现在我们增加一个新的需求,我们某个页面需要一个用户列表,而不仅仅是一个单一的用户信息,那么这里就需要创建一个用户列表数组。
    下面代码演示了使用JSON形式定义这个用户列表:

    [
    {"UserID":11, "Name":{"FirstName":"Truly","LastName":"Zhu"}, "Email":"zhuleipro◎hotmail.com"},
    {"UserID":12, "Name":{"FirstName":"Jeffrey","LastName":"Richter"}, "Email":"xxx◎xxx.com"},
    {"UserID":13, "Name":{"FirstName":"Scott","LastName":"Gu"}, "Email":"xxx2◎xxx2.com"}
    ]


    完整代码:

    <script>
    var UserList = [
    {"UserID":11, "Name":{"FirstName":"Truly","LastName":"Zhu"}, "Email":"zhuleipro◎hotmail.com"},
    {"UserID":12, "Name":{"FirstName":"Jeffrey","LastName":"Richter"}, "Email":"xxx◎xxx.com"},
    {"UserID":13, "Name":{"FirstName":"Scott","LastName":"Gu"}, "Email":"xxx2◎xxx2.com"}
    ];
    alert(UserList[0].Name.FirstName);
    </script>

    事实上除了使用"."引用属性外,我们还可以使用下面语句:

    alert(UserList[0]["Name"]["FirstName"]); 或者 alert(UserList[0].Name["FirstName"]); 
  •      var map=[{'text':'1222','id':'5','leaf':true,'checked':false,'expanded':true,'parentid':'2','Rank':'2','Sort':'1'},
            {'text':'杭州','id':'13','leaf':true,'checked':false,'expanded':true,'parentid':'2','Rank':'2','Sort':'1'},
            {'text':'2222','id':'3','leaf':false,'expanded':false,'parentid':'2','Rank':'2','Sort':'2'}];
             var mapData =map;
             for(var i in mapData)
              {
                    alert(i);
                    var obj = mapData[i];
                     alert(    obj.text);
    //                for(var attr in obj )
    //                {
    //                alert("key:" + attr );
    //                alert("value:" + obj[attr]);
    //                }
              }

    现在读者应该对JSON的使用有点认识了,归纳为以下几点:

  • 对象是属性、值对的集合。一个对象的开始于“{”,结束于“}”。每一个属性名和值间用“:”提示,属性间用“,”分隔。
  • 数组是有顺序的值的集合。一个数组开始于"[",结束于"]",值之间用","分隔。
  • 值可以是引号里的字符串、数字、true、false、null,也可以是对象或数组。这些结构都能嵌套。
  • 字符串和数字的定义和C或Java基本一致。
  • 相关阅读:
    点击按钮icon input同步获取焦点
    修改vue项目中 elementUI input样式
    vue $route 和$router的区别
    vue 路由 vue-router 模式 hash history
    vue 路由跳转
    git 合并某个提交 git cherry-pick
    请求传参 有特殊符号
    前端 组件库 ,js等
    ajax请求成功,返回了数据,但是跳到了error情况
    微信-公众号-网页授权开发
  • 原文地址:https://www.cnblogs.com/aaa6818162/p/1599135.html
  • Copyright © 2020-2023  润新知