熟悉ES6或者在开发中使用过Axios或者Fetch的同学一定听过Promise,因为以上两种异步请求库都是基于Promise对象对Ajax进行的封装，那么你对Promise了解吗？
什么是Promise
首先Promise不是ES6提出来的，Promise是一种异步编程的解决方案，只是ES6对其进行了语法规范，首先大家应该清楚，JS是单线程的语言，但又因为其宿主环境（浏览器或Node）是多线程的，所以JS实现异步编程和JS的单线程之间并不存在矛盾，传统中，我们会用回调函数或者事件来实现JS的异步编程，但Promise的提出和实现，使JS的异步编程变得更加强大。
Promise其实是一个容器函数，里面包含着未来才会知道的结果（比如http请求或者其他异步调用的方法）。这些异步操作可以决定Promise对象的状态，Promise有且仅有三种状态分别为pending(进行中)、fulfilled(已成功)、rejected(已失败)。且Promise的这三种状态只能由其中包含的异步操作的结果来决定。到底哪种结果决定什么样的状态,这是和你的编程逻辑有关。
这里需要举个例子：大家都知道，当Axios请求成功的时候（Axios内部封装的请求成功指调通后台接口，不是http状态为200），是返回一个Promise对象，这时候，我们可以用 then来指定其成功后，接下来的回调函数的。身边有的同学会以为， Promise之所以状态变为 fulfilled是因为http请求成功了。这便是封装影响了你对Promise的真正认识，现在我来告诉大家，之所以请求成功Promise状态会变为fulfilled，是因为封装 Axios的人，让它这样的。假如我们自己来封装，我们也完全可以让http状态码为200时状态变为成功，其他状态我们都返回失败，这样我们就只能在http状态为200时调用then中的函数了，其他状态我们都将用catch抛出。
上面花较大篇幅来举这个例子，只是为了告诉大家Promise的状态只能由其包裹的异步操作的结果来决定，且什么样的结果决定什么样的状态是自己的编程逻辑决定，而非固定,可以看出来Promise对象是一个很倔强的对象，这也是Promise对象名字的来历，其英文单词的意思为“承诺”。
Promise对象的状态一旦改变，就将定性在此，不会发生二次改变，并且我们可以放心的在任何时候拿到这个结果并使用。这便是Promise相对于事件的优势，假如我们在事件方法中设定了回调函数，只要是错过了这个事件，即使是再去监听也是得不到结果的，而Promise可以在任何时候拿到结果。
Promise的基本用法
首先，Promise的三种状态的改变只有两种情况
- 从
pending变为fulfilled,这时我们称为resolve - 从
pending变为rejected,这时我们称为reject
基础较好的同学，相信在看到我上面举的例子的时候，已经对Promise的基本用法有所了解。下面我们用代码做一个最简单的演示
首先我们得知道，在ES6中，Promise是一个构造函数，用来生成Promise对象实例，就类似于Array、Function、Object这样的构造函数一样，用来生成对应的实例。
const myPromise = new Promise（(resolve,reject) => {
/*这里写我们的异步操作方法*/
if(/*异步操作成功*/) {
resolve(/*这里我们可以写参数也可以不写，
写参数代表要传出来的值，不写就只代表一个成功状态，
这个要看情况决定写与不写*/)
} else {
reject(/*同样，这里我们可以写参数也可不写参数*/)
}
}
）
以上就是Promise对象最简单的应用。其中，我们可以发现，构造函数中接受两个参数，一个是resolve一个是reject,它们分别是两个函数，作用为将异步操作结果作为参数传出去，resolve是Promise状态由pending变为fulfilled时调用，reject是Promise状态由pending变为rejected时调用，一般情况下，我们都是在异步操作成功后，将异步操作的结果作为resolve的参数传递出去，这样，思路会比较顺，即异步操作成功，Promise状态变为已完成，同理，异步操作失败，我们将结果给reject传递出去。
通过上面的讲解，我们知道了，Promise回将异步操作的结果传递出来，那么传递出来的结果到哪了呢？或者说，谁来接这个传出来的结果呢？
then方法的使用
then可以用来指定resolve和reject状态的回调函数，也就是说，我们传出来的值是用then来接的。具体使用如下：
//我们接上面创建的myPromise代码块
myPromise.then(success => {
/*对于resolve函数传出值的处理*/
},error => {
/*对于reject函数传出值的处理*/
})
通过上面的代码我们可以看出来，then接受两个回调函数做为参数，分别代表resolve和reject状态下的回调，其中两个函数的参数为Promise对象的传出值。
说到这里，有的同学会提出疑问：“我们平时使用的then是只接受一个参数的呀，没见过接受俩参数的”
这里我来解答，因为then方法执行完，是会再返回一个Promise对象的，而Promise对象的错误是冒泡传递的，所以，我们可以不用对每一次的报错都做处理，我们可以放在Promise链最后用catch方法统一捕获并处理（当然，加入Promise对象不做抛出，我们是无法捕获到这些信息的）。所以，then方法的第二个参数是可选的，并且，又因为then返回的又是一个Promise对象，所以我们才可以使用链式写法。
既然我们可以把错误集中到一起处理，那么我们可不可以把成功集中处理呢？
Promise.all()方法的使用
通常我们会有这样的需求，‘当几个异步操作全部完成，我们才做统一处理’，这就是我们使用all方法的时候，它的意思是，同时有几个Promise对象正在执行，我们可以集中在一起拿到各个Promise返回的值，当然不止是成功时候的返回值，也可以包括失败返回的值，需要注意的是，成功的时候返回的是一个结果数组，而失败的时候，我们会捕获第一个失败的值。我们看下面的代码
const promiseOne = new Promise(resolve => {
resolve('成功了')
})
const promiseTwo = new Promise((resolve, reject) => {
reject('失败了')
})
const promiseThere = new Promise((resolve, reject) => {
resolve('哈哈')
})
Promise.all([promiseOne,promiseThere]).then(result => {
console.log(result )
}).catch(err => {
console.log(err)
})
这时控制的输出结果为
const promiseOne = new Promise(resolve => {
resolve('成功了')
})
const promiseTwo = new Promise((resolve, reject) => {
reject('失败了')
})
const promiseThere = new Promise((resolve, reject) => {
resolve('哈哈')
})
Promise.all([promiseOne,promiseTwo,promiseThere]).then(result => {
console.log(result )
}).catch(err => {
console.log(err)
})
这时控制台输出的结果为
上面的两个代码块，带大家演示了
Promise.all()方法的使用，细心的同学会发现，在我第一次输出结果的图中吗，控制台除了打印结果外，还有一行红字，‘Uncaught (in promise) 失败了’，那么这个信息是来自哪里呢？这是来自我在创建“promiseTwo ”的时候，那么同样的代码，在第二个代码块怎么没有报错呢？因为，第二个代码块中，我用到了“promiseTwo”,并对抛出的错误做了处理，第一个代码块我没有用，所以也就没法处理他的错误，他就会自动抛出他的错（因为我在创建他的时候用到了reject方法抛出这个错）。我没有用它它还抛出错误了，这不是浪费性能吗？
事实上，
Promise对象在创建的时候就会执行（也就是上面提到的pending）,所以我们在开发中一般不这么创建，而是将Promise放到一个函数中。
function timeout(ms) {
return new Promise((resolve, reject) => {
setTimeout(resolve, ms, 'done');
});
}
timeout(100).then((value) => {
console.log(value);
});
就像上面这样。这里就是我们在开发中需要注意的细节了，这样创建的Promise对象才是最优化的。
关于Promise对象，我们在实际开发中，我上面讲的都是经常用到的，当然还会有一些不常用的关于PromiseAPI,这里需要用心的同学们去自己专研了，本文章还是以往抛转引玉作用。想要了解更多的关于Promise知识，爱心满满的作者总会给大家带来传送门
- http://es6.ruanyifeng.com/#docs/promise
今天文章就到此结束了，相信认真读完文章的你会对Promise有一个更加清晰的认识，同时对于之前使用过的和Promise相关的“Axios”、“Fetch”等库也会有更加清晰的认识。
感谢您的浏览~