Promise 异步请求

一、Promise 能给我们带来了什么？

           首先，promise 是 ES6 定义的一个处理异步操作的方法，他可以将异步操作以同步的形式写出来，最大的一个特点就是能够解决我们以往的地狱式回调，而且他一旦执行，结果就不可改变的性质也使得我们更为精准的定位以往很难查找的错误。

二、Promise 的使用实例

          1、Promise 的创建

  let PUA = function(val) {
    return new Promise((resolve, reject) => {
	  if (val === 1) resolve('成功')
	  else reject('失败')
	})
  }
  console.log(PUA(1)) // 值与 if 匹配，会返回成功，控制台打印请看下图

  let PUA = function(val) {
    return new Promise((resolve, reject) => {
	  if (val === 1) resolve('成功')
	  else reject('失败')
	})
  }
  console.log(PUA(2)) // 值与 if 不匹配，返回失败

           在我们使用的时候，就可以直接将我们的请求啊什么的放进去了，得到成功返回后，我们就可以进行下一步的操作了哈，那我们常用的后续操作一般都会放到 .then() 里面，不得不说，这个灰常好用，来，接着往下看

            2、Promise 的 .then() 方法

  let PUA = function(val) {
    return new Promise((resolve, reject) => {
	  if (val === 1) resolve('成功')
	  else reject('失败')
	})
  }
  // 首先看成功后.then()是否成功回调
  PUA(1).then((val) => {
    console.log(val)
    console.log('成功后就会打印我')
  })

 

  let PUA = function(val) {
    return new Promise((resolve, reject) => {
	  if (val === 1) resolve('成功')
	  else reject('失败')
	})
  }
  // pronise内执行rejext后.then()是否成功回调
  PUA(2).then((val) => {
    console.log(val)
	console.log('成功后就会打印我')
  })

 

           3、那如果不想看到这个报错，我想在错误时执行某些操作呢？好办，那就进行错误捕捉 .catch() 

  let PUA = function(val) {
    return new Promise((resolve, reject) => {
	  if (val === 1) resolve('成功')
	  else reject('失败')
	})
  }
  // pronise内执行rejext后.then()是否成功回调
  PUA(2).then((val) => {
    console.log(val)
	console.log('成功后就会打印我')
  })
  .catch(err => {
    console.log(err)
	console.log('现在你可以在错误时执行你的骚操作了')
  })

 

          4、那有人又说了，我不管成功或是失败，我都要进行一些正常的操作，那么，ES6 又要满足你了，用这个 .finally() 方法，像 .catch() 一样，直接在后面接着点点点就可以

.finally(() => {
  console.log('我不受限制，不管错误或是成功我都能执行')
})

          看了上面的例子后，相信 promiise 的基本用法都会了，那么值得注意的是，在 .then(val) 里面的 'val' ，它返回的永远是上一次成功的结果。其次，既然 .then() 能拿到上一次成功的结果，那是不是后面都能拿到上一次成功的结果呢？是的，这里就是我们所说的链式调用，能解决我们以前的回调地狱的一个重要的方法，很简单，就是不停的 .then()

三、Promise.all()

           1、.all() 作用：能把多个 promis 结果包装成一个 promise ；

           2、应用场景：同一操作需要多个成功返回支撑；

           话不多说，上干货

           为了直观点，先看成功的例子

  let PUA1 = function(val) {
    return new Promise((resolve, reject) => {
	  if (val === 1) resolve('成功')
	  else reject('失败')
	})
  }
  let PUA2 = function(val) {
    return new Promise((resolve, reject) => {
	  if (val === 2) resolve('成功')
	  else reject('失败')
	})
  }
  let PUA3 = function(val) {
    return new Promise((resolve, reject) => {
	  if (val === 3) resolve('成功')
	  else reject('失败')
	})
  }
  // 下面我们把上面的三个单独的promisr利用.all()方法整合起来
  let PArr = Promise.all([PUA1(1), PUA2(2), PUA3(3)]) // 全部成功的参数
  // 些时，在这里单独打印已经能看到结果了
  console.log(PArr)
  PArr.then((val) => {
    console.log(val)
  })
  .catch(err => {
    console.log(err)
  })

            接下来看失败的例子

  let PUA1 = function(val) {
    return new Promise((resolve, reject) => {
	  if (val === 1) resolve('成功')
	  else reject('失败')
	})
  }
  let PUA2 = function(val) {
    return new Promise((resolve, reject) => {
	  if (val === 2) resolve('成功')
	  else reject('失败')
	})
  }
  let PUA3 = function(val) {
    return new Promise((resolve, reject) => {
	  if (val === 3) resolve('成功')
	  else reject('失败')
	})
  }
  // 下面我们把上面的三个单独的promisr利用.all()方法整合起来
  let PArr = Promise.all([PUA1(2), PUA2(2), PUA3(3)]) // 有一个失败返回的参数
  // 些时，在这里单独打印已经能看到结果了
  console.log(PArr)
  PArr.then((val) => {
    console.log(val)
  })
  .catch(err => {
    console.log(err)
  })

 注：promise 还有其他几个方法，有兴趣的可以自己去了解下，不过一般来说，以上的分享就够用了，但学无止境嘛，哈哈