Javascript异步流程控制之Promise(3)-ES6原生Promise简介

Javascript异步流程控制之Promise(3)-ES6原生Promise简介

原文写于 2015-02-28 https://github.com/kuitos/kuitos.github.io/issues/19

前面两篇介绍了一些Promise的概念已经在AngularJs中的应用,前面也说过Promise模型已经成为ES6中的一个事实标准。今天在这里就简单介绍下ES6中原生Promise的用法:

Promise Constructor
var promise = new Promise(function(resolve, reject) {
    // 异步处理
    // 处理结束后、调用resolve 或 reject
});
Promise then
promise.then(onFulfilled, onRejected);
// 结合上面的构造函数,我们这样去用
var promise = new Promise(function(resolve, reject) {
    // 用定时器模拟异步处理
    setTimeout(function(){
        resolve("ok");
    },2000);
});
promise.then(function(msg){
    console.log(msg);
});
// 两秒之后打出ok
Promise catch
// 异常捕获,只要then链中有一个被reject或抛出异常就会被catch
promise.then(function(){}).then(function(){}).catch(function(msg){
    console.log(msg);
});
静态方法 Promise.all
// 前几篇说过这是一个非常好用的方法,like this
var p1 = new Promise(function(resolve){
    setTimeout(function(){
        resolve(1);
    },1000);
});
var p2 = new Promise(function(resolve){
    setTimeout(function(){
        resolve(2);
    },2000);
});
var p3 = new Promise(function(resolve){
    setTimeout(function(){
        resolve(3);
    },3000);
});
Promise.all([p1,p2,p3]).then(function(msg){
    console.log(msg); // [1,2,3]
});

// 只有当所有的promise都resolve才会进入then链的success回调,如果有一个reject,就直接进入then链的error callback
静态方法 Promise.race
// 这个方法也很好用,与Promise.all类似,只不过Promise.all是与集关系,Promise.race是或集关系。顾名思义,竞争的promises
var p1 = new Promise(function(resolve){
    setTimeout(function(){
        resolve(1);
    },1000);
});
var p2 = new Promise(function(resolve){
    setTimeout(function(){
        resolve(2);
    },2000);
});

Promise.race([p1,p2]).then(function(msg){
    console.log(msg); // 1
});
// p1先被resolve,所以打印出的就是1

目前高版本的chrome跟firefox均以实现标准的原生Promise,上文中的代码各位均可放到浏览器中一试究竟。
至此,javascript异步流程控制之Promise系列完结,鼓掌!(��)
更多Promise相关内容请看这里:Promise迷你书

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值