深入浅出ES6教程『Promise』

作者: 苏日俪格 | 来源:发表于2018-06-06 14:34 被阅读9次

大家好,本人名叫苏日俪格,大家叫我 (格格) 就好,在上一章节中我们学到了对象的用法,下面我们一起来继续学习Promise:

作用:解决异步回调的问题,ajax交互的回调复用性太差,通过promise可以解决,多说无益,我们来看一个例子:

let a = 1;
new Promise(function(resolve, reject){
    if (a == 1) {
        resolve('成功');
    } else{
        reject('失败');
    }
}).then(res => {
    console.log(res);   // 成功
},err => {
    console.log(err);
});

resolve是成功的回调函数
reject是失败的回调函数

成功失败的回调都可以简写成一个成功状态的或是失败状态的promise对象:

var p = Promise.resolve('成功');
p.then(res => {
    console.log(res);  // 成功
});

上面的这种成功回调简写和下面这种正常写法是一样的:

var p = new Promise(function(resolve){
    resolve('成功');
});
p.then(res => {
    console.log(res);  // 成功
});

失败的回调函数也是同理,另外失败的回调还可以通过catch捕获,然后放在then函数的后面即可,个人推荐这种写法:

new Promise(function(resolve,reject){
    if(false){
        resolve('成功');
    }else{
        reject('失败');
    }
}).then(res => {
    console.log(res);
}).catch(err => {
    console.log(err);   // 失败
});

Promise.all()/Promise.race():两者可以将多个promise对象打包在一个数组里,打包完还是一个promise对象

let p1 = Promise.resolve('aaa');
let p2 = Promise.resolve('bbb');
let p3 = Promise.resolve('ccc');
Promise.all([p1,p2,p3]).then(res => {
    let [res1,res2,res3] = res; // 解构赋值
    console.log(res);   // ["aaa", "bbb", "ccc"]
    console.log(res1,res2,res3);    // aaa bbb ccc
});

二者的区别:在没有catch抛出异常的时候:all是所有扔进数组的Promise对象都必须是resolve状态的,只要有一个reject状态的就会失败;而race是只要有一个promise对象是resolve状态的就会成功

关于Promise我们都已经了然于心,预知模块化如何,请听下回分解 (^∀^)/~~~

本文的所有内容均是一字一句敲上去的,希望大家阅读完本文可以有所收获,因为能力有限,掌握的知识也是不够全面,欢迎大家提出来一起分享!谢谢O(∩_∩)O~

github个人主页:https://github.com/YuFy1314
我的博客:http://www.cnblogs.com/yufy/
Resume:https://yufy1314.github.io/
等一下( •́ .̫ •̀ ),我还有最后一句话:
这里虽然没有都市的繁华,
也没有山林的鸟语花香,
只有一片如水的宁静,
古人云:
既来之则安之,
既然来到了这里,
就可以静心休憩你的灵魂,
调养你疲惫的心,
再见...

相关文章

网友评论

    本文标题:深入浅出ES6教程『Promise』

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