浅谈JavaScript中承诺的使用

　　

<强>阅读目录

　　
    　　<李>什么是Prmoise李 　　<李>承诺的使用李 　　
　　

最近在看《你不知道的javascript中卷》,发觉作者花了基本一半的篇幅去讲异步和承诺,觉得有必要总结一下。

　　

其实本文的目的是想手写一个承诺的,无奈总结着总结着发觉篇幅有点长,因此只好一分为二,先介绍承诺的用法,知道怎么用,我们才知道怎么写,所以把手写一个承诺的任务放到了下一篇文章当中。

　　

当然,网上有很多关于承诺的文章,都可以参考参考,有误之处,欢迎之处。

　　

<强>什么是Prmoise

　　

承诺是ES6新增的一个特征,它已被列入ES6的正式规范中

　　

承诺对象可以理解为一次执行的异步操作,使用承诺对象之后可以使用一种链式调用的方式来组织代码,让代码更加的直观。也就是说,有了承诺对象,就可以将异步操作以同步的操作的流程表达出来,避免了层层嵌套的回调函数。

　　

示例:未使用承诺,回调必须层层嵌套

　　 　　 　　美元。ajax (url1函数(data1) {//做某事… 　　美元。ajax (url2函数(data2) {//做某事… 　　美元。ajax (url3函数(data3) {//做某事… 　　完成(data3);//返回数据 　　}） 　　}）; 　　}); 　　 　　

如果有多个嵌套,导致代码不够直观,而且如果几个操作之前没有前后顺序之分,需要等待上一个操作完成才可以进行下一个操作,造成不必要的等待

　　

就承诺是为了解决这些问题而产生的。

　　

　　

　　

承诺对象代表一个异步操作,有三种状态

　　
    　　<李>待定(执行中) 　　<李>解决(成功,又称实现) 　　<李>拒绝(拒绝) 　　
　　

其中等待为初始状态,满足和拒绝为结束状态(结束状态表示承诺的生命周期已结束)。

　　

承诺只有异步操作的结果,可以决定当前是哪一种状态,任何其他操作都无法改变这个状态. .

　　

　　

承诺对象的状态改变,只有两种可能:从等待变为解决和从等待变为拒绝

　　

<代码>等待→完成,等待→拒绝。

　　

只要这两种情况发生,状态就凝固了,不会再变了,会一直保持这个结果

　　

　　

1,无法取消承诺,一旦新建它就会立即执行,无法中途取消。

　　

2,如果不设置回调函数,保证内部抛出的错误,不会反应到外部。

　　

3,当处于等待状态时,无法得知目前进展到哪一个阶段(刚刚开始还是即将完成)。

　　

　　

　　

除了IE这种古老的浏览器和一些低版本的安卓外,现代浏览器支持还是挺好的,所以我们可以在谷歌的控制台直接测试我们的代码

　　

<强>承诺的使用

　　

先提前说明一下,下面的代码示例,都可以复制到谷歌的控制台就行测试! !

　　

　　

(1),首先我们新一个承诺,将承诺实例化

　　

(2),然后在实例化的承诺可以传两个参数,一个是成功之后的决心,一个是失败之后的拒绝

　　

(3),保证实例生成以后,可以用然后方法分别指定解决状态和拒绝状态的回调函数

　　

代码如下:

　　 　　 　　var承诺=函数(isReady) { 　　返回新的承诺(函数(解决,拒绝){//做一些,也许异步 　　如果(isReady) { 　　返回解决(“hello world”); 　　其他}{ 　　返回拒绝(“失败”); 　　} 　　}）; 　　}//保证实例生成以后,可以用然后方法分别指定解决状态和拒绝状态的回调函数。 　　承诺(真正的),然后(功能(价值){//成功,这里是解决的回调函数 　　console.log(价值);//hello world 　　}、功能(err) {//失败,这里是拒绝的回调函数 　　console.log (err) 　　}) 　　 　　

上述代码是执行成功,返回hello world,如果想测试一下失败后的返回值,可以在承诺(真)……这里改为承诺(false)…即可

　　

　　

也许你会说,承诺只是简化层层回调的写法而已吧,其实不然,它的精髓是通过维护状态,传递状态的方式来使回调方式能够及时的调用,因此,相比于回调,它更灵活,更简单。下面我们来看看承诺的链式操作:

　　 　　 　　makePromise1 () 　　不要犹豫(函数(值){ 　　console.log(价值); 　　返回makePromise2 (); 　　}） 　　不要犹豫(函数(值){ 　　console.log(价值); 　　返回makePromise3 (); 　　}） 　　不要犹豫(函数(值){ 　　console.log(价值); 　　}）; 　　函数makePromise1 () { 　　var p=新的承诺(函数(解决,拒绝){//异步操作 　　setTimeout(函数(){ 　　console.log(“异步任务1 '); 　　解决(“异步任务1传过来的值'); 　　},2000); 　　}）; 　　返回p; 　　} 　　函数makePromise2 () { 　　var p=新的承诺(函数(解决,拒绝){//异步操作 　　setTimeout(函数(){ 　　console.log(“异步任务2 '); 　　解决(“异步任务2传过来的值'); 　　},2000); 　　}）; 　　返回p; 　　} 　　函数makePromise3 () { 　　var p=新的承诺(函数(解决,拒绝){//异步操作 　　setTimeout(函数(){ 　　console.log(“异步任务3 '); 　　解决(“异步任务3传过来的值'); 　　},2000); 　　}）; 　　返回p; 　　} 　　

浅谈JavaScript中承诺的使用