JavaScript:扩展知识(1)——JSON

理解:

   关于 JSON,最重要的是要理解它是一种数据格式,不是一种编程语言。虽然具有相同的语法形式,但 JSON 并不从属于 JavaScript。而且,并不是只有 JavaScript 才使用 JSON,毕竟 JSON 只是一种数据格式。很多编程语言都有针对 JSON 的解析器和序列化器。

  • JSON 文件的文件类型是 ".json"
  • JSON 文本的 MIME 类型是 "application/json"

语法:

JSON取值

  • 数字(整数或浮点数)
  • 字符串(在双引号中)
  • 逻辑值(true 或 false)
  • 数组(在中括号中)
  • 对象(在大括号中)
  • null
{ "age":30 }

{ "flag":true }

{ "runoob":null }

对象

说明:

  1.JSON对象在{}中书写。

  2.对象可以包含多个 key/value(键/值)对。

  3.key必须为字符串,value必须为合法的JSON数据类型。

  4.key 和 value 中使用冒号(:)分割。每个 key/value 对使用逗号(,)分割。

对象表示法:

/*JSON对象表示法*/
{
“name”:"MS",
"age":100,
"id":10010
}

对象数组:

/*JSON数组*/
[
{"title":"a","num":10},
{"title":"b","num":20},
{"title":"c","num":30}
]

访问对象值:

/*使用 . 访问对象值*/
var myObj, x;
myObj = { "name":"runoob", "alexa":10000, "site":null };
x = myObj.name; /*使用 [] 访问对象值*/
var myObj, x;
myObj = myObj = { "name":"runoob", "alexa":10000, "site":null };
x = myObj["name"];

使用循环来遍历对象

var myObj = { "name":"runoob", "alexa":10000, "site":null };
for (x in myObj) {
document.getElementById("demo").innerHTML += myObj[x] + "<br>";
}

嵌套JSON对象

一个JSON对象嵌套另一个JSON对象

myObj = {
"name":"runoob",
"alexa":10000,
"sites": {
"site1":"www.runoob.com",
"site2":"m.runoob.com",
"site3":"c.runoob.com"
}
}

访问嵌套的JSON对象

x = myObj.sites.site1;
// 或者
x = myObj.sites["site1"];

修改值

myObj.sites.site1 = "www.google.com";

myObj.sites["site1"] = "www.google.com";

删除对象属性

delete myObj.sites.site1;

delete myObj.sites["site1"]

解析和序列化

解析

说明:

  • JSON 通常用于与服务端交换数据。
  • 在接收服务器数据时一般是字符串。
  • 我们可以使用 JSON.parse() 方法将数据转换为 JavaScript 对象。

  

从服务端接收JSON数据(http://www.runoob.com/json/json-parse.html)

使用 AJAX 从服务器请求 JSON 数据,并解析为 JavaScript 对象。

var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
myObj = JSON.parse(this.responseText);
document.getElementById("demo").innerHTML = myObj.name;
}
};
xmlhttp.open("GET", "/try/ajax/json_demo.txt", true);
xmlhttp.send();

序列化

说明:

  • JSON 通常用于与服务端交换数据。
  • 在向服务器发送数据时一般是字符串。
  • 我们可以使用 JSON.stringify() 方法将 JavaScript 对象转换为字符串。
  • JSON.stringify(value[, replacer[, space]])

  

JavaScript:基础扩展(1)——JSON的更多相关文章

  1. JavaScript基础知识(JSON、Function对象、原型、引用类型)

    19.JSON 概念:JavaScript 对象表示法(JavaScript Object Notation),是一种轻量级的数据交换格式  特点:易于程序员编写和查看:易于计算机解析和生成 数据结构 ...

  2. 【javascript基础】 原生JSON.parse解析异常问题

    [问题背景]用jQ,ajax返回json,返回的字符串如:{name:"suntiger035"},status:200,readyState:4,代码无任何问题,结果,succe ...

  3. 【Java EE 学习 31】【JavaScript基础增强】【Ajax基础】【Json基础】

    一.JavaScript基础增强 1.弹窗 (1)使用window对象的showModelDialog方法和showModelessDialog方法分别可以弹出模式窗口和非模式窗口,但是只能在IE中使 ...

  4. JavaScript基础笔记(十一)JSON

    JSON 关于JSON,最重要的一点是理解它是一种数据格式,不是编程语言. 一.语法 JSON 不支持变量.函数或对象实例,它就是一种表示结构化数据的格式,虽然与 JavaScript 中表示数据的某 ...

  5. Web开发——JavaScript基础(JSON教程)

    参考: JSON:JavaScript 对象表示法(JavaScript Object Notation). JSON 是存储和交换文本信息的语法.类似 XML. JSON 比 XML 更小.更快,更 ...

  6. javascript基础语法——词法结构

    × 目录 [1]java [2]定义 [3]大小写[4]保留字[5]注释[6]空白[7]分号 前面的话 javascript是一门简单的语言,也是一门复杂的语言.说它简单,是因为学会使用它只需片刻功夫 ...

  7. 全栈必备 JavaScript基础

    1995年,诞生了JavaScript语言,那一年,我刚刚从大学毕业.在今年RedMonk 推出的2017 年第一季度编程语言排行榜中,JavaScript 排第一,Java 第二,Python 反超 ...

  8. Web前端-JavaScript基础教程上

    Web前端-JavaScript基础教程 将放入菜单栏中,便于阅读! JavaScript是web前端开发的编程语言,大多数网站都使用到了JavaScript,所以我们要进行学习,JavaScript ...

  9. 1、JavaScript 基础一 (从零学习JavaScript)

    1:定义:javascript是一种弱类型.动态类型.解释型的脚本语言. 弱类型:类型检查不严格,偏向于容忍隐式类型转换. 强类型:类型检查严格,偏向于不容忍隐式类型转换. 动态类型:运行的时候执行类 ...

随机推荐

  1. awk之随机函数rand()和srand()

    awk之随机函数rand()和srand() 分类: LINUX 文件: abcdefg ...... 现在想要随机抽取5列组成下面的内容,允许重复: cffab ...... awk -F '' ' ...

  2. http加密原理

    HTTPS原理 客户端向服务器发送请求 服务器向客户端发送自己的证书 客户端验证证书的有效性(是否是可信用机构CA颁发的证书,如果不是则提出警告)并对比里面信息是否正确,不通过则立刻断开连接 向服务器 ...

  3. flask/sqlalchemy - OperationalError: (sqlite3.OperationalError) no such table

    狗书第五章 记得要先创建表 执行 db.create_all()语句来创建表 https://segmentfault.com/q/1010000005794140

  4. Matlab字符串分割

    data = '1.21, 1.985, 1.955, 2.015, 1.885'; C = strsplit(data,', ') C = '1.21' '1.985' '1.955' '2.015 ...

  5. Word常用操作笔记

    总忘,在这记一下,以下以WPS为例,WORD大同小异,别看网上那些乱写的,就哥这个稳定好使: 1. 在指定页面及其后开始插入页码 2. 修改页码中的总页数 -> 选中总页数的域 -> SH ...

  6. MathType可以编辑省略号吗

    说到省略号大家可能会想到写文章的时候会用到,其实在数学中也会常常的使用到.当数学过程是重复有规律性的过程时,就会用到它.MathType是一款数学公式编辑器,那么,在数学公式中,MathType编辑时 ...

  7. 去OpenCVManager,大部分为转载,仅当自己学习使用

    去OpenCVManager方法,可以参考这篇博客http://blog.csdn.net/yanzi1225627/article/details/27863615,可以用,挺好的.我这里只是做个总 ...

  8. 小知识,大智慧(restframework 拾忆)

    一.直接对query_set序列化,在页面展示的效果是Unicode 编码格式 ,可在json 序列化时候加入一个参数 course_query = DegreeCourse.objects.all( ...

  9. Laravel5.1 模型--查询作用域

    所谓的查询作用域就是允许你自定义一个查询语句 把它封装成一个方法. 1 定义一个查询作用域 定义查询作用域就是在模型中声明一个scope开头的方法: public function scopeHotA ...

  10. HTML5的兴起与4G网络的出现,能否够终止移动端的持续下滑走向

    HTML5的兴起与4G网络的出现,能否够终止移动端的持续下滑走向. 每当大家谈起互联网的未来的时候,多半谈及的是云.大数据.SAAS.仿佛要将一切摒弃.而当谈起移动互联网的时候.却坚持觉得NATIVE ...