ES6之Promise的学习

朱雀 2020-07-01 20:59 654阅读 0赞

# ES6之Promise的学习

## Promise开篇

因为javascript异步机制，导致一个常见的问题，回调金字塔：

```
loadImg('a.jpg', function() {
    loadImg('b.jpg', function() {
        loadImg('c.jpg', function() {
            console.log('all done!');
        });
    });
});
```

**Promise** 字面意思，承诺。如果A调用B，B返回一个承诺给A,然后A就可以写计划时这么写：当B返回结果给我的时候，A执行S1方案，反之如果B因为什么原因没有给A想要的结果，那么A执行应急方案S2,这样的话，所有潜在风险都在A的控制范围内

```
var resB = B();
var runA = function(){
   resB.then(execS1,execS2);
};
```

如果A要完成一件事，可能依赖的不是B一个响应，那么上面的代码就会变成

```
var resB = B();
var resC = C();
...
 
var runA = function() {
    reqB
        .then(resC, execS2)
        .then(resD, execS3)
        .then(resE, execS4)
        ...
        .then(execS1);
};
 
runA();
```

在这里，每当一个询问者做出不符合预期的应答的时候都用了不同的处理机制，虽然，Promise规范没有要求这样做，甚至可以不做任何处理，即（不传入then的第二个参数），或者统一处理

## Promise/A+规范

- 一个Promise可能存在三种状态:等待**(pending)**,已完成**(fulfilled)**,已拒绝**(rejected)**
- 一个Promise的状态只可能从"等待"转到"完成"或者"拒绝",不能逆向转换
- Promise必须实现then方法，**(then是promise核心)**,而且then必须返回一个promise，同一个promise的then可以调用多次，并且回调执行的顺序和它们定义的顺序一样。
- then方法接受两个参数,第一个参数是成功时候的回调，另一个是失败的回调，then可以接受另一个promise传入，也接受一个"类then"的对象或者方法，即thenable对象

## 标准的Promise

可参考html5rocks的这篇文章JavaScript Promises，目前高级浏览器如chrome、firefox都已经内置了Promise对象，提供更多的操作接口，比如Promise.all()
，支持传入一个promises数组，当所有promises都完成时执行then，还有就是更加友好强大的异常捕获，应对日常的异步编程，应该足够了。

## 第三方库的Promise

现今流行的各大js库，几乎都不同程度的实现了Promise，如dojo，jQuery、Zepto、when.js、Q等，只是暴露出来的大都是Deferred
对象，

## 尾声

我们看到，不管Promise实现怎么复杂，但是它的用法却很简单，组织的代码很清晰，从此不用再受callback的折磨了。
最后，Promise是如此的优雅！但Promise也只是解决了回调的深层嵌套的问题，真正简化JavaScript异步编程的还是Generator，在Node.js端，建议考虑Generator。