Promise例子

来源：互联网发布：u盘物理损坏数据恢复编辑：程序博客网时间：2024/06/05 14:31

前言：我看过沙漠下暴雨，看过大海亲吻鲨鱼，看过黄昏追逐黎明，没看过"你"；网上对于Promise的解释的文章很多，不过茫茫“文”海中，要找一个讲得好的，太难，而且还要找到一个自己这种水平能看懂的例子，更难，所以需要多方查证，然后自己总结一个适合自己能力水平看得懂的文章才行。（领悟出一个道理：打铁还需自身硬）

（好文章还是很多，但是我这边是带着完成一个功能的目的去学习知识的）

https://segmentfault.com/a/1190000002928371 这一篇公认的基础篇，对于快速入门来说很好，方便学习，例子也很简单易懂

http://www.cnblogs.com/huansky/p/5676978.html 这一篇是我觉得API介绍得很全的一篇，例子也很好

http://www.imooc.com/article/3627 这一篇不得不说是一个进阶篇，对于有一定的基础的人去学习这个收获肯定不少

http://blog.csdn.net/z69183787/article/details/60143576 async/await

tips:

Promise主要是解决啥的呢？个人粗浅地认为：当我们有多个异步请求的时候，想在所有请求都成功的情况下再继续进行其他处理，我们一般的解决方法要么是自己定义一个计数器counter，当每完成一个请求counter++，这样就能判断是否完成所有请求，或者第二个请求在第一个请求成功后再进行.....其实阅读前面的推荐的文章你就知道Promise.all( )就能解决刚才这个需求；当然这只是其中一个例子。

我这边想实现的目的是：

jq的ajax配合promise对象，实现发送2次ajax请求，第二次是在第一次发送请求成功且底层返回状态为成功之后再发送；

原因：

在做SD卡格式化的时候底层要求是当SD卡在发送格式化命令后还需要发送一个挂载的命令，这样去实现的时候会出现回调嵌套，后面得知promise就是为了解决这种问题应运而生的，所以选择去学习一下。

下面是具体代码：（我这边没有介绍基础语法，直接上了撸代码，毕竟前面推荐了文章，所以当大家都懂了语法和基础知识）

如果是用原生的方法:

说明：这里是在WebStorm上进行测试（因为可以模拟一个服务器环境，方便我们使用ajax），我这边也简化了很多步骤，直接去请求一下example.txt这个文档，当获取到正确数据后再去请求第二个文档，也没有进行出错处理等等~~~不严谨

$.ajax({        type: "post",        url:"example.txt",        success:function(data){           if(data==1)           {            $.ajax({                type: "post",                url: "example2.txt",                success: function (data) {                    console.log(data);                 }               });             }          }      });

下面是用Promise去做：

这边还用了settimeout去模拟了一下时延，因为在实际操作中请求数据的时候有可能没那么快，因为我测试的时候是在本地；

需要注意的是：

then方法里面的回调函数是在这个Promise对象状态改变后调用的；
既然Promise可以链式调用，例如p.then( ).then()....这样，就意味着它肯定会返回一个Promise对象，如果我们在then中自己手动返回了一个数据，那么下一个then的回调函数中可以使用这个数据，但是这个then方法的Promise对象还是上一个对象，代表着上一个Promise对象状态改变了，那么我们如果p.then( ).then( )，里面的回调函数会一个接一个马上调用；如果我们是手动再返回了一个新的Promise对象，那么下一个then方法就是新的Promise中的对象的方法了，是代表新的Promise对象状态改变后的回调函数，而不是前一个，p.then( ).then( )这样调用的话，第二个then需要判断新的Promise状态是否改变才决定是否调用；

var p1 = new Promise(function (resolve) {    $.ajax({        type: "post",        url:"example.txt",        success:function(data){            console.log("请求1")            setTimeout(function(){                resolve(data);            },2000);        }    });});p1.then(function(data){    console.log("请求1成功:"+data);    if(data==1)    {        var p2= new Promise(function (resolve) {            $.ajax({                type: "post",                url: "example2.txt",                success: function (data) {                    console.log("请求2")                    setTimeout(function () {                        resolve(data);                    }, 2000)                }            });        });        p2.then(function(data) {             console.log("请求2成功:"+data);        })    }})

当然还可以换一种写法，其实也没差多少

var p1 = new Promise(function (resolve) {    $.ajax({        type: "post",        url:"example.txt",        success:function(data){            console.log("请求1")            setTimeout(function(){                resolve(data);            },2000);        }    });});p1.then(function(data){    console.log("请求1成功:"+data);    if(data==1)    {        return new Promise(function (resolve) {            $.ajax({                type: "post",                url: "example2.txt",                success: function (data) {                    console.log("请求2")                    setTimeout(function () {                        resolve(data);                    }, 2000)                }            });        });    }}).then(function(data){      console.log("请求2成功:"+data);})

阅读全文

0 0