JSON 是用于存储和传输数据的格式,通常用于服务端向网页传递数据

什么是 JSON?

JSON英文全称 JavaScript Object Notation(JavaScript 对象表示法),是一种轻量级的用于存储和交换文本信息的语法,被设计用于可读的数据交换,类似 XML,但比 XML 更小、更快,JSON具有自我描述性,更易理解

JSON 简介

JSON是从 JavaScript 脚本语言中演变而来,使用Javascript语法来描述数据对象,文件名扩展是 .json,但是JSON格式仅仅是一个文本,仍然独立于语言和平台。JSON 解析器和 JSON 库支持许多不同的编程语言。 目前非常多的动态(PHP,JSP,.NET)编程语言都支持JSON

JSON 使用范围

JSON 格式可以用于通过网络连接序列化和传输结构化数据,用于编写基于 JavaScript 应用程序,包括浏览器扩展和网站。JSON 主要用于在服务器和 Web 应用程序之间传输数据,Web 服务和 APIs 可以使用 JSON 格式提供公用数据,还可以用于现代编程语言中

JSON 语法

JSON 的语法基本上可以视为 JavaScript 语法的一个子集,包括以下内容:

数据使用名/值对表示

使用大括号保存对象,每个名称后面跟着一个 ':'(冒号),名/值对使用 ,(逗号)分割

使用方括号保存数组,数组值使用 ,(逗号)分割

 {
"book": [
{
"id":"01",
"language": "Java",
"edition": "third",
"author": "Herbert Schildt"
},
{
"id":"07",
"language": "C++",
"edition": "second"
"author": "E.Balagurusamy"
}]
}

JSON 支持以下两种数据结构:

名/值对集合: 这一数据结构由不同的编程语言支持

有序的值列表: 包括数组,列表,向量或序列等等

JSON 语法规则

JSON 语法是 JavaScript 对象语法的子集

数据在名称/值对中

数据由逗号分隔

花括号保存对象

方括号保存数组

JSON 名称/值对

JSON 数据的书写格式是:名称/值对

名称/值对包括字段名称(在双引号中),后面写一个冒号,然后是值:

  {"firstName":"John", "lastName":"Doe"} 

等价于这条 JavaScript 语句:

 firstName = "John", lastName = "Doe"

JSON 值

JSON 值可以是:

数字(整数或浮点数)

字符串(在双引号中)

逻辑值(true 或 false)

数组(在方括号中)

对象(在花括号中)

null

JSON 对象

JSON 对象在花括号中书写,对象可以包含多个名称/值对

JSON 数组

JSON 数组在方括号中书写,数组可包含多个对象

  "employees":[
{"firstName":"John", "lastName":"Doe"},
{"firstName":"Anna", "lastName":"Smith"},
{"firstName":"Peter", "lastName":"Jones"}
]

JSON 使用 JavaScript 语法

因为 JSON 使用 JavaScript 语法,所以无需额外的软件就能处理 JavaScript 中的 JSON。JavaScript 程序使用内建的 eval() 函数,用 JSON 数据来生成原生的 JavaScript 对象。
通过 JavaScript,您可以创建一个对象数组,并像上面代码那样赋值。然后像这样访问 JavaScript 对象数组中的第一项

 employees[0].lastName;

返回的内容是:

  Doe

也可以像这样修改数据:

 employees[0].firstName = "Jonatan";

JSON 文件

JSON 文件的文件类型是 ".json"

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

JSON 使用

把 JSON 文本转换为 JavaScript 对象

JSON 最常见的用法之一,是从 web 服务器上读取 JSON 数据(作为文件或作为 HttpRequest),将 JSON 数据转换为 JavaScript 对象,然后在网页中使用该数据。

简单起见,我们直接设置 JSON 字符串:

首先,创建 JavaScript 字符串,字符传为 JSON 格式的数据:

 var text = '{ "employees" : [' +
'{ "firstName":"John" , "lastName":"Doe" },' +
'{ "firstName":"Anna" , "lastName":"Smith" },' +
'{ "firstName":"Peter" , "lastName":"Jones" } ]}';

由于 JSON 语法是 JavaScript 语法的子集,JavaScript 函数 eval() 可用于将 JSON 文本转换为 JavaScript 对象

eval() 函数使用的是 JavaScript 编译器,可解析 JSON 文本,然后生成 JavaScript 对象。必须把文本包围在括号中,这样才能避免语法错误:

 var obj = eval ("(" + txt + ")"); 

在网页中使用 JavaScript 对象:

 <p>
First Name: <span id="fname"></span><br />
Last Name: <span id="lname"></span><br />
</p>
<script>
document.getElementById("fname").innerHTML = obj.employees[1].firstName
document.getElementById("lname").innerHTML = obj.employees[1].lastName
</script>

摘抄 - JavaScript JSON的总结的更多相关文章

  1. JavaScript Json对象和Json对象字符串的关系 jsonObj<->JsonString

    JavaScript Json对象和Json对象字符串的关系 jsonObj<->JsonString 如下示例: 直接写的a1就是一个Json对象,a2 就是一个Json对象字符串; 通 ...

  2. JavaScript JSON timer(计时器) AJAX HTTP请求 同源策略 跨域请求

    JSON 介绍 1. JSON: JavaScript Object Notation 是一种轻量级的数据交换格式. 它基于ECMAScript的一个子集. JSON采用完全独立于语言的文本格式,但是 ...

  3. JavaScript -- JSON.parse 函数 和 JSON.stringify 函数

    JavaScript -- JSON.parse 函数 和 JSON.stringify 函数 1. JSON.parse 函数: 使用 JSON.parse 可将 JSON 字符串转换成对象. &l ...

  4. 细读 php json数据和JavaScript json数据

    关于JSON的优点: 1.基于纯文本,跨平台传递极其简单: 2.Javascript原生支持,后台语言几乎全部支持: 3.轻量级数据格式,占用字符数量极少,特别适合互联网传递: 4.可读性较强 5.容 ...

  5. JavaScript JSON AJAX 同源策略 跨域请求

    网页和Ajax和跨域的关系 1 Ajax使网页可以动态地.异步地的与服务器进行数据交互,可以让网页局部地与服务器进行数据交互 2 Ajax强调的是异步,但是会碰到跨域的问题. 3 而有很多技术可以解决 ...

  6. javascript.json snippets vscode 注释

    vscode vue js里面的注释 javascript.json { // Place your global snippets here. Each snippet is defined und ...

  7. javascript json写法

    javascript json写法 var shuxing = {name:"super",sex:"19",work:"IT"}; 这个k ...

  8. JavaScript JSON 与 AJAX

    JavaScript JSON 与 AJAX JSON 是一种轻量的数据交互格式,与 AJAX 配合完成前端页面与服务端的信息传递,本文介绍 JSON 的使用.原生 AJAX 写法.JSONP 跨域解 ...

  9. javascript json字符串与对象相互转换

    在实际项目中,经常遇到字符格式的问题,记下来以便日后方便查看.用到两个函数:JSON.stringify() 和 JSON.parse(). 使用ajax向后台请求数据,后台给前端返回数据,明明后端脚 ...

随机推荐

  1. Speculative store buffer

    A speculative store buffer is speculatively updated in response to speculative store memory operatio ...

  2. Codechef May Challenge 2015

    随便瞎写,其实没做出多少题: Chef and Cake 题目大概是用输入的数生成 一个数组并且生成出q个[X,Y]的询问, 数组长度N<=1000000,q<=10^7; 开始用线段树, ...

  3. linux修改PS1,自定义命令提示符样式

    目录 参数说明 修改颜色 linux默认的命令提示符是这样的: 白色的,如果当前执行的命令很多的话,一整块屏幕上全是一堆输出信息,上一条命令在哪?我刚输入的命令在哪?找的头晕.有没有办法可以修改命令提 ...

  4. CDI Services *Decoretions *Intercepters * Scope * EL\(Sp EL) *Eventmodel

    1.Decorators装饰器综述 拦截器是一种强大的方法在应用程序捕捉运行方法和解耦.拦截器可以拦截任何java类型的调用.  这使得拦截器适合解决事务管理,安全性,以及日记记录.  本质上说,拦截 ...

  5. 对dispatch_async到主线程的逻辑封装成C/C++接口类型

    背景:代码里面有时候会把将要运行的内容放到主线程里面运行,但假设已经是主线程里面的代码调用dispatch_async的时候偶尔会出现crash,所以就须要推断是否已经在主线程里面了. 通常的做法类似 ...

  6. 为RAC私有网络配置网卡Bonding

    在RAC的安装部署过程中.并不不过简单的安装完毕了事.整个安装过程要考虑可能出现的单点问题,当中比較重要的是私有网络. 私有网络是RAC节点间通信的通道.包含节点间的网络心跳信息.Cache fusi ...

  7. XP 系统如何安装.NET Framework4.0

    1 运行CMD,然后输入命令net stop WuAuServ   2 打开C盘的Windows目录,然后找到SoftwareDistribution文件夹改名为SDold.   3 在CMD窗口中输 ...

  8. antd 离线 icon

    讲你下载下来的官方提供的字体库解压后所有文件复制到node-modules/antd/dist目录下 创建新的文件夹iconfont 在你项目生成的css入口文件对应的源码less文件开始添加如下两句 ...

  9. PHP中常见的header类型

    <?php // 使用 mime_content_type() 查看 $mimetypes=array( 'ez' => 'application/andrew-inset', 'hqx' ...

  10. Chapter1-data access reloaded:Entity Framework(下)

    1.4 Delving deep into object/relational differences 深入挖掘对象关系的不同 理解面向对象和关系世界的不同是重要的,因为他会影响你设计一个对象模型或者 ...