JSON入门学习笔记（2019.8.14）

最新推荐文章于 2023-02-25 21:05:40 发布

汐汐如梦

最新推荐文章于 2023-02-25 21:05:40 发布

阅读量117

点赞数 1

分类专栏：学习笔记文章标签： JSON

本文链接：https://blog.csdn.net/weixin_43877400/article/details/99585544

版权

学习笔记专栏收录该内容

13 篇文章 0 订阅

订阅专栏

JSON入门学习笔记

一、概述

JSON: JavaScript Object Notation(JavaScript 对象表示法)

JSON 是存储和交换文本信息的语法，类似 XML。

JSON 比 XML 更小、更快，更易解析

二、使用范围

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

三、特点

JSON 容易阅读和编写。
它是一种轻量级的基于文本的交换格式。
语言无关。

四、与XML的区别和联系

区别：

没有结束标签
更短
读写的速度更快
能够使用内建的 JavaScript eval() 方法进行解析
使用数组
不使用保留字

联系：
JSON 是纯文本
JSON 具有"自我描述性"（人类可读）
JSON 具有层级结构（值中存在值）
JSON 可通过 JavaScript 进行解析
JSON 数据可使用 AJAX 进行传输

五、语法（JSON 的语法基本上可以视为 JavaScript 语法的一个子集）

数据使用名/值对表示。
使用大括号保存对象，每个名称后面跟着一个 ‘:’（冒号），名/值对使用 ,（逗号）分割。
使用方括号保存数组，数组值使用 ,（逗号）分割。
JSON名称/值对：

名称/值对包括字段名称（在双引号中），后面写一个冒号，然后是值
```
"firstName" : "John"  //等价于firstName = "John"
```
JSON文件：文件的文件类型：".json"/文本的MIME 类型是 “application/json”

六、JSONP教程

jsonp(JSON with Padding) 是 json 的一种"使用模式"，可以让网页从别的域名（网站）那获取资料，即跨域读取数据。
原理：利用标签可以获取不同源资源的特点，来达到跨域访问某个资源的目的

jQuery使用JSONP

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>JSONP 实例</title>
		<script src="http://apps.bdimg.com/libs/jquery/1.8.3/jquery.js"></script>
	</head>

	<body>
		<div id="divCustomers"></div>
		<script>
			$.getJSON("/try/ajax/jsonp.php?jsoncallback=?", function(data) {

				var html = '<ul>';
				for(var i = 0; i < data.length; i++) {
					html += '<li>' + data[i] + '</li>';
				}
				html += '</ul>';

				$('#divCustomers').html(html);
			});
		</script>
	</body>

</html>

七、JSONP基础

数据类型

类型	描述
数字型（Number）	JavaScript 中的双精度浮点型格式
字符串型（String）	双引号包裹的 Unicode 字符和反斜杠转义字符
布尔型（Boolean）	true 或 false
数组（Array）	有序的值序列
值（Value）	可以是字符串，数字，true 或 false，null 等等
对象（Object）	无序的键:值对集合
空格（Whitespace）	可用于任意符号对之间
null	空

基础结构
- 对象结构
  
  对象结构是使用大括号“{}”括起来的，大括号内是由0个或多个用英文逗号分隔的“关键字:值”对（key:value）构成的。
```
var jsonObj =
{
    "键名1":值1,
    "键名2":值2,
    ……
    "键名n":值n
}
```
- 数组结构
  
  JSON数组结构是用中括号“[]”括起来，中括号内部由0个或多个以英文逗号“,”分隔的值列表组成
```
var arr =
[
    {
        "键名1":值1,
        "键名2":值2
    },
    {
        "键名3":值3,
        "键名4":值4
    },
    ……
]
```
元素的增加与删除
- 删除
  1. shift()
    
    删除原数组第一项，并返回删除元素的值；如果数组为空则返回undefined
    
    var chaomao=[1,2,3,4,5]
    var chaomao.shift()//得到1
    alert(chaomao)//[2,3,4,5]
  2. pop()
    
    删除原数组最后一项，并返回删除元素的值；如果数组为空则返回undefined
    
    var chaomao=[1,2,3,4,5]
    var chaomao.pop()//得到5
    alert(chaomao)//[1,2,3,4]
- 任意操作
  
  splice()
  1. 删除
    
    var chaomao=[1,2,3,4,5]
    chaomao.splice(2,1)
    alert(chaomao)//1,2,4,5
  2. 添加
    
    var chaomao=[1,2,3,4,5]
    chaomao.splice(2,0,8,9)
    alert(chaomao)//1,2,8,9,3,4,5
  3. 修改
    
    var chaomao=[1,2,3,4,5]
    chaomao.splice(2,1,8,9)
    alert(chaomao)//1,2,8,9,4,5