XMLHttpRequest对象
Ajax定制软件技术的核心是XMLHttpRequest对象（简称）,定制软件这是有微软率先引入的一个特性，定制软件其他浏览器提供商后来定制软件都提供了相同的实现。
但因为IE定制软件的兼容性问题，定制软件这里对低版本的IE定制软件兼容性不做过多的描述。
XMLHttpRequest定制软件是一个构造函数，定制软件现在已经被各大浏览器定制软件厂商所支持，IE定制软件的话事支持IE7以上，XMLHttpRequest定制软件函数提供的方法有如下几个：
open: open定制软件有三个参数，定制软件第一个参数规定了当前定制软件请求的类型(get、post、put、delete、head)，定制软件请求的统一资源定位符url，定制软件以及是同步还是异步的定制软件一个布尔值。
send: 在使用open定制软件方法创建请求以备发送之后，再调用send方法，定制软件就可以发送服务器进行定制软件这一次请求了。send定制软件方法主要是传递当前的定制软件请求是否需要给服务器传递数据。
tips: 如果是get请求，则直接在open的url定制软件后面拼接上即可，定制软件但是不同浏览器对于url定制软件的长度是有限制的比如ie是2KB chrome是8KB大小，并且get请求是明文可见的，所以一般只是用来做查询数据的处理。在数据缓存方面因为get是用户查找数据，可以和不同的数据表进行联系，所以可以用于做服务器端缓存，但是post请求则不一样，post一般是用于传递数据进行数据表的增删改，并不合适于做缓存，并且post的数据传递在ajax中是不可见的，安全性方面也是优于get。
在send传递参数给服务器端之后，便会从服务器端获取服务器端数据的响应，判断服务器端是否成功接收到数据，并且返回响应的数据。
那么此时，会存在几个属性可以调用：
responseText:作为响应主体被返回的文本。
responseXML:如果响应的文件是text/xml或application/xml，这个属性包含着返回的xml文件。
status:当前响应的HTTP请求。
statusText：HTTP状态的说明。
那么，如何判断当前的响应状态呢，可以使用这个事件处理程序来进行监听，同时配合readyState属性来搭配监听。
readyState有5个状态：
0 尚未初始化。尚未调用open()方法。
1 启动。已经调用open方法，但还未使用send方法
2 发送。已经调用send方法，但尚未接收到响应数据
3 接受。已经接收到部分响应的数据
4 完成。已经全部接受到响应回来的数据，而且已经可以在客户端使用了。
在开发中经常会遇到在页面DOM加载完成之后向服务器端发起多个Ajax请求，比如有多个请求，后一个的请求需要上一次请求的返回结果。过去常规做法只能 callback 层层嵌套，这也就是多层ajax嵌套的回调地狱。
为了解决异步多层嵌套的问题，ES6推出了一个新的构造函数Promise。
Jquery $ajax
ajax是一个前后台配合的技术，它可以让javascript发送http请求与后台进行通信，从而获取后台返回的数据。ajax的原理是实例化xmlHttp对象，使用此对象与后台通信。在这里Jquery将他封装成了一个函数$.ajax()，并解决了多种浏览器的兼容性问题，我们可以直接使用这个方法。
它是对原生XHR的封装，还支持JSONP，非常方便；真的是用过的都说好。但是随着react，vue等前端框架的兴起，jquery早已不复当年之勇。很多情况下我们只需要使用ajax，但是却需要引入整个jquery，这非常的不合理，所以开始出现了新的插件比如axios等等。
ES6 Promise
Promise是一个构造函数对象本身有all、reject、resolve这几个方法，有fulfilled(已成功)/pengding(进行中)/rejected(已拒绝)这三种状态，原型上有then、catch等方法。
Promise可以接受一个参数那就是函数，并且这个函数有两个参数：resolve,reject，resolve和reject分别表示异步操作执行成功后的回调函数resolve和执行失败之后的回调函数reject。
在实例化promise对象之后，我们可以使用then和catch方法来进行成功后的回调和失败后的处理。then和catch都接受一个返回值，这个值包含了成功和失败后的状态和返回值，下面是执行then方法成功后获取的返回值，是一个对象包含了经典的xmlHttpRequest对象和status状态码，已经从后台获取的数据data。
如果想要更语义化一点可以使用另一个方法catch，当ajax出现异常的时候用于捕获promise的错误情况。
Promise.all
为了解决多层回调地狱的嵌套问题，promise提供了一个新的方法。Promise.all接受一个promise对象的数组作为参数，当这个数组里的所有对象都会resolve或者至少有一个reject状态的时候，它才会去调用then方法。
all方法会把回调函数放在promise对象数组中最慢返回的对象中去执行，也就是不必担心多层依赖的问题。
Promise.race
promise.race的字面量意思是竞赛，其用法和接受的参数和all一样，只不过race会把回调函数放在promise对象数组执行最快的回调中去执行。
扩展：Promise和axios在vue中的应用
在vue-cli脚手架中我们使用了axios进行ajax发送请求，axios是一个底层基于xmlHttpRequest的插件可用于node和浏览器端，因为需要使用promise对象来进行结果处理，所以使用的时候需要浏览器支持Es6。
axios支持get和post请求，对于jsonp请求作者认为是不安全的，所以在axios中并没有jsonp的方法，需要另外使用。
在上图中我们可以看到，在vue-cli脚手架中引用了axios之后创建了一个函数creatPromis用来重复创建promise对象，在对象里我们创建了一个axios函数，并且在then和catch中传入了resolve和reject用来分别执行成功和失败的回调。
我们创建了五个promise对象，通过一个数组把这五个对象传入其中并当参数传递给promise.all方法，当着五个promise都被正确执行的时候，我们会执行then里面的方法，否则会执行catch。这样不仅代码简洁还解决了传统意义上的多层ajax嵌套的回调地狱。
ES7 async
Promise虽然一定程度减少了回调嵌套，但是并不能完全消除嵌套。举个例子，对于多个依赖的promise来说，每产生一次依赖，就会增加一次嵌套。另外，采用promise的代码看起来依然是异步的，并不是同步。
async也是函数，所以具有普通函数该有的性质。不过形式上有几点不同：在定义async异步函数的时候，需要在function关键字钱加上async关键字，二是在函数内部可以使用await关键字，代表等待，表示后面跟随的结果当成异步操作并等待其完成。
async函数是generator函数的语法糖。它的定义方式有以下几种：
async是异步的意思，他本身也是是基于promise对象实现的，在获取到返回的值的时候我们需要用到原型链上的then方法去接受返回值，可以看出加了async关键字的函数timeout并没有阻碍js后面的执行。
async是基于promise对象实现的，所以会有resove和reject方法，这里我们传入一个flag参数，当为true的时候内部就会执行resove，但为false的时候就会执行reject。
await顾名思义有等待的意思，一旦在函数前加了await就代表，必须等当前的函数执行完毕，浏览器才会继续向下运行解析。在下图中我们使用了voteTest函数，并在内部执行了getVoteData函数，并在前面添加了关键字await，3秒钟过后voteTest下面的console开始了打印数据。
await就是用来等待Promise对象中resolve和reject这两个函数的执行的，并且将这两个函数传递的参数当作返回结果赋给变量，如同下图run函数中的代码示例那样。