ES6 Promise详解

2020-03-04  本文已影响0人  ryanWSJ

一、为什么有Promise

在使用JavaScript时,为了实现某些逻辑经常会写出层层嵌套的回调函数,如果嵌套过多,会极大影响代码可读性和逻辑,这种情况也被成为回调地狱。代码层层嵌套,阅读性很差。为了优化这类问题,出现了Promise。

二、 什么是Promise

Promise 是异步编程的一种解决方案。简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果。Promise 提供统一的 API,各种异步操作都可以用同样的方法进行处理。

Promise 特点:

  1. 中文意思是“承诺”,对象的状态不受外界影响。Promise对象代表一个异步操作,只有三种状态:pending(进行中)、fulfilled(已成功)和rejected(已失败),只有内部的异步操作结果可以决定状态,其它任何操作都无法改变。
  2. 状态一旦改变之后将不会再发生变化,无论什么时候获取都是这个结果。

三、怎么使用

一个简单例子:

function timeout(ms) {
  return new Promise((resolve, reject) => {
    setTimeout(resolve, ms, 'done')
  })
}

timeout(100).then((value) => {
  console.log(value);
})

Promise实例生成以后,可以用then方法分别指定resolved状态和rejected状态的回调函数。

pro.then((res) => {
    // resolev 完成状态回调
}, (error) => {
    // rejected 失败状态回调,可省略
}).catch((err) => {
    // 捕捉到错误
}})

then方法里面第二参数是reject的时候触发的回调函数,可省略。then方法后面可以根catch,promise内部和then方法内部的错误都会被catch捕捉到。

四、Promise的API

Promise.resolve()
Promise.reject()
Promise.prototype.then()
Promise.prototype.catch()
Promise.all(promises: List<Promise>) // 所有的promise都返回执行才会执行then
Promise.race(promises: List<Promise>) // 完成一个promise即可

例子:

let pro1 = new Promise(function(resolve,reject){
    resolve(1);
});
let pro2 = new Promise(function(resolve,reject){
    resolve(2);
});
let pro3 = new Promise(function(resolve,reject){
    resolve(3);
});
Promise.all([pro1, pro2, pro3]).then(function (results) {
    // results 是一个数组,保存着所有promise中resolve返回的值
    console.log('success:' + results);
    console.log(results);
}).catch(function(r){
    console.log("error");
    console.log(r);
});

<meta charset="utf-8">

参考资料:
阮一峰《ES6 入门教程》
黄大渣渣《js promise看这篇就够了》

上一篇下一篇

猜你喜欢

热点阅读