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. 让你的程序通过XP防火墙

    procedure TForm1.Button1Click(Sender: TObject); var FwMgr,Profile,FwApp: variant; begin FwMgr := Cre ...

  2. 测试ssh框架中hibernate的事务

    <!-- 配置切面 --> <aop:config> <aop:pointcut expression="execution(* com.xxx.lobs.ma ...

  3. apache POI 操作excel<导入导出>

    1.首先导入maven依赖 <!-- POI核心依赖 --> <dependency> <groupId>org.apache.poi</groupId> ...

  4. Mysql 变量讲解

    set语句的学习: 使用select定义用户变量的实践将如下语句改成select的形式: set @VAR=(select sum(amount) from penalties);我的修改: sele ...

  5. C#通过修改注册表改变IE默认选项

    修改注册表,这个代码好实现,关键是怎么找到对应的注册表值,也就是说画一条线很容易,难的是找到要在哪里画,然后我百度了一圈,出来的都是画线的,没有指出或者指出的不全的注册表对应值,只能FQ谷歌了,也就有 ...

  6. jxta 2.8x启动了

    http://chaupal.github.io/ ———————————————————————————————————————————————————————————————————— 至少两个月 ...

  7. JS常用的方法总结

    /** * 将参数格式化为对象 * @param urlParams type string * @example * let urlParams = 'name="xiaoliu" ...

  8. oracle高水位

    oracle高水位http://www.cnblogs.com/chuyuhuashi/p/3548260.htmlhttp://blog.csdn.net/wyzxg/article/details ...

  9. java httpSession 设置超时时间

    1.设置过期时间方式一:在tomcat/conf/web.xml下加入一下内容 <session-config> <session-timeout>90</session ...

  10. Classification week2: logistic regression classifier 笔记

    华盛顿大学 machine learning: Classification 笔记. linear classifier 线性分类器 多项式: Logistic regression & 概率 ...