XMLHttpRequest的基本使用
什么XMLHttpRequest
XMLHttpRequest（简称 xhr）是浏览器提供的 Javascript 对象，通过它，可以请求服务器上的数据资源。
使用xhr发起GET请求（***）
步骤
// 1. 创建 XHR 对象
var xhr = new XMLHttpRequest()
// 2. 调用 open 函数 准备发送. 参数直接加在网址后面（age=18）
xhr.open('GET', 'http://www.liulongbin.top:3006/api/getbooks?age=18')
// 3. 调用 send 函数 发送
xhr.send()
// 4. 监听 onreadystatechange 事件
xhr.onreadystatechange = function () {
// readyState = 4 有0，1，2，3，4这五个阶段，4表示ajax请求已完成（失败或成功）
if (xhr.readyState === 4 && xhr.status === 200) {
// 获取服务器响应的数据
console.log(xhr.responseText)
}
}了解xhr 对象的readyState 属性
XMLHttpRequest 对象的 readyState 属性，用来表示 当前 Ajax 请求所处的状态 。每个 Ajax 请求 必然处于以 下状态中的一个：
查询字符串
什么是查询字符串 定义： 查询字符串（ URL 参数）是指在 URL 的末尾加上用于向服务器发送信息的字符串（变量）。 格式： 将英文的 ? 放在 URL 的末尾，然后再加上 参数＝值 ，想加上多个参数的话，使用 & 符号进行分隔。以 这个形式，可以将想要发送给服务器的数据添加到 URL 中。 GET请求携带参数的本质就是查询字符串 无论使用 $.ajax() ，还是使用 $.get() ，又或者直接使用 xhr 对象发起 GET 请求，当需要携带参 数的时候，本质上，都是直接将参数以查询字符串的形式，追加到 URL 地址的后面，发送到服务器 的。URL编码与解码
什么是URL编码
URL 地址中，只允许出现英文相关的字母、标点符号、数字，因此， 不允许出现中文字符。 必须对中文字符进行 编码 （转义）。 URL 编码原则的通俗理解：使用英文字符去表示非英文字符//encodeURI其他字符转码
var str2 = encodeURI('芜湖，起飞')
console.log(str2)
//解码
var str3 = decodeURI('%E9%BB%91%E9%A9%AC')
console.log(str3)使用xhr发起POST请求（***）
// 1. 创建 xhr 对象
var xhr = new XMLHttpRequest()
// 2. 调用 open 函数 准备发起请求
xhr.open('POST', 'http://www.liulongbin.top:3006/api/addbook')
// 3. 设置 Content-Type 属性,发送post请求的固定写法，get不用
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded')
// 4. 调用 send 函数 发送post请求
xhr.send('bookname=水浒传a&author=施耐庵a&publisher=上海图书出版社a')
// 5. 监听事件
xhr.onreadystatechange = function () {
if (xhr.readyState === 4 && xhr.status === 200) {
// responseText，响应的文本
console.log(xhr.responseText)
}
}数据交换格式
什么是数据交换格式
数据交换格式，就是 服务器端 与 客户端 之间进行 数据传输与交换的格式 前端领域，经常提及的两种数据交换格式分别是 XML 和 JSON 。其中 XML 用的非常少，所以，我们重点要的数据交换格式就是 JSON什么是XML
XML 的英文全称是 EXtensible Markup Language ，即 可扩展标记语言 。因此， XML 和 HTML 类 似， 也是一种标记语言。比较 臃肿，和数据无关的代码多，体积大，传输效率低XML和HTML的区别
XML 和 HTML 虽然都是标记语言，但是，它们两者之间没有任何的关系。 HTML 被设计用来描述网页上的 内容 ，是网页内容的载体 XML 被设计用来 传输和存储数据 ，是数据的载体什么是JSON
概念： JSON 的英文全称是 JavaScript Object Notation ，即 “ JavaScript 对象表示法 ”。 JSON 的作用： 在计算机与网络之间存储和传输数据。 JSON 的本质： 用字符串来表示 Javascript 对象数据或数组数据JSON 的两种结构
JSON 就是用字符串来表示 Javascript 的对象和数组。所以， JSON 中包含 对象 和 数组 两种结构，通过两种结构的相互嵌套，可以表示各种复杂的数据结构。 对象结构 对象结构在 JSON 中表示为 { } 括起来的内容。数据结构为 { key: value, key: value, … } 的 键值对结构。其中， key 必须是使用英文的双引号包裹的字符串， value 的数据类型可以是 数字、字 串、 布尔值、 null 、数组、对象 6 种类型。 数组结构 数组结构在 JSON 中表示为 [ ] 括起来的内容。数据结构为 [ "java", "javascript", 30, true … ] 。 数组中数据的类型可以是 数字、字符串、布尔值、 null 、数组、对象 6 种类型。JSON 和JS 对象的互转
// 必须都用双引号包裹
// JSON 的本质：用字符串来表示 Javascript 对象数据或数组数据
// json字符串转化为对象或数组，因为计算机数据只能识别json字符串
// var jsonStr = '{"a": "Hello", "b": "world"}'
// var obj = JSON.parse(jsonStr)
// console.log(obj)
// 对象或数组转化为json字符串JSON.stringify()，因为对象或数组更好用
var obj2 = { a: 'hello', b: 'world', c: false }
var str = JSON.stringify(obj2)
console.log(str)
console.log(typeof str)