美文网首页
【简单粗暴】最简单粗暴的promise解释与使用

【简单粗暴】最简单粗暴的promise解释与使用

作者: 前端架构师陈龙威 | 来源:发表于2019-10-29 15:13 被阅读0次

最简单粗暴的使用方法,不讲原理

new Promise((resolve, reject) => {
    // 成功是resolve走then方法,失败是reject走catch方法
    
    // setTimeout相当于你异步事件的处理,比如ajax请求,遍历等。
    setTimeout( () => {
        if (true) {
            resolve('成功');
        } else {
            reject('失败');
        }
    }, 1000);
}).then(res => {
        // 接下来的回调,一般只需要then方法就够用了。
        console.log(`success:${res}`);
}).catch(err => {
        console.log(`error:${err}`);
})

另一种常用方式:把promise放到方法里

function getData() {
      let a = new Promise((resolve, reject) => {
            // ...
      });
      return a;
}
getData().then().catch(); // then捕捉resolve,catch捕捉reject
或
getData().then(doneEvent, failEvent); // then接受2个参数

另外jquery中的类似promise方法:
$.Deferred()类似Promise()$.when()类似Promise.all()

// 主要有resolve, reject, then
// 以及done, fail, always
function runAsync() {
    var defer = $.Deferred();
    setTimeout(function() {
        console.log('执行完成');
        defer.resolve('成功之后的数据返回');
    }, 1000);
    return defer.promise(); // 在此调用原因:https://www.cnblogs.com/yelongsan/p/7644239.html
}

// $.Deferred()的then接受3个参数,doneEvent, failEvent, progressEvent,第三个不清楚用来干嘛
runAsync().then(function(success){
    console.log(success);
}, function(fail) {
    console.log(fail);
})

// $.Deferred()的done(成功执行),fail(失败执行),always(不管成功失败都执行)使用:
runAsync().done(res=>console.log(res)).fail(err=>console.log(err)).always(msg=>console.log(msg))

// $.when()的使用,接受的非数组,而是多个Deferred对象
$.when(runAsync(), runAsync(), runAsync()).then(function(data1, data2, data3) {
    console.log(data1, data2, data3);
})

// 具体使用,方式1:
function runAsync() {
    var defer = $.Deferred();
    setTimeout(function() {
        console.log('执行完成');
        defer.resolve('成功之后的数据返回');
    }, 1000);
    return defer.promise(); // 在此调用原因:https://www.cnblogs.com/yelongsan/p/7644239.html
}
runAsync().then()

// 方式2:
$.Deferred(function(defer) {
    setTimeout(function(){
        defer.resolve(false);
    }, 1000);
}).promise().then(function(res){
    console.log(res)
})

相关文章

  • 【简单粗暴】最简单粗暴的promise解释与使用

    最简单粗暴的使用方法,不讲原理 另一种常用方式:把promise放到方法里 另外jquery中的类似promise...

  • 手写实现Promise功能

    简单粗暴,全部代码如下: class Promise{ constructor(executor){ t...

  • 秒懂“全渠道”!最短小精悍的解释在这里!

    小编按:关于“全渠道”,最简单粗暴的解释都在这里了,看完秒懂!

  • 简单粗暴

    有时候,其实你需要的东西很简单。就是陪伴与关注。……

  • 简单粗暴

    常常为吃饭时间的到来发愁。如果人可以不吃饭?那么,我一定是赞成的那个。首先是因为智商低,智商低的人一般不敢考虑吃饭...

  • 简单——粗暴

    嗯…画的粗糙!运动会班牌 丙烯(๑´╹‸╹`๑) 然后男孩子画残了!再一次觉得不能用签字笔勾线!上颜料就晕染 o(...

  • 简单粗暴

    两个人在一起本来就应该简单粗暴, 有好感就在一起, 别拖拖拉拉的没完没了, 不喜欢就干脆拒绝 ,闹矛盾就讲出来, ...

  • 简单粗暴

    很喜欢池莉的小说。像她的小说《烦恼人生》、《来来往往》、《热也好冷也好活着就好》,用写实主义手法道出了武汉市民的生...

  • 简单粗暴

    每天尽力更文,文不见有多大进步,视力却是相当进步了。 这几天瞧东西,越来越模糊。视疲劳越来越严重,老是想闭目养神。...

  • 简单粗暴

    小妹家的三娃是个不学习的学渣,上三年级了,结果一年级的东西都不会,在学校里经常受同学歧视。 小妹觉得无所谓,只要他...

网友评论

      本文标题:【简单粗暴】最简单粗暴的promise解释与使用

      本文链接:https://www.haomeiwen.com/subject/iubbmftx.html