Promise

概念

所谓Promise,简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果。

特点

  1. 对象的状态不受外界影响。Promise 对象代表一个异步操作,有三种状态:Pending(进行中)、Resolved(已完成,又称 Fulfilled)和 Rejected(已失败)。只有异步操作的结果,可以决定当前是哪一种状态,任何其他操作都无法改变这个状态。这也是 Promise 这个名字的由来,它的英语意思就是「承诺」,表示其他手段无法改变。

  2. 一旦状态改变,就不会再变,任何时候都可以得到这个结果。Promise 对象的状态改变,只有两种可能:从 Pending 变为 Resolved 和从 Pending 变为 Rejected。只要这两种情况发生,状态就凝固了,不会再变了,会一直保持这个结果。就算改变已经发生了,你再对 Promise 对象添加回调函数,也会立即得到这个结果。这与事件(Event)完全不同,事件的特点是,如果你错过了它,再去监听,是得不到结果的。

缺点

首先,无法取消 Promise,一旦新建它就会立即执行,无法中途取消。其次,如果不设置回调函数,Promise 内部抛出的错误,不会反应到外部。第三,当处于 Pending 状态时,无法得知目前进展到哪一个阶段(刚刚开始还是即将完成)。

基本语法

var Promise = new Promise(function(resolve, reject) {
if (/* 异步操作成功 */){
resolve(value);
} else {
reject(error);
}
}); promise.then(function(value) {
// success
}, function(value) {
// failure
});

Promise 构造函数接受一个函数作为参数,该函数的两个参数分别是 resolve 方法和 reject 方法。

如果异步操作成功,则用 resolve 方法将 Promise 对象的状态,从「未完成」变为「成功」(即从 pending 变为 resolved);

如果异步操作失败,则用 reject 方法将 Promise 对象的状态,从「未完成」变为「失败」(即从 pending 变为 rejected)。

方法

Promise.all(iterable)

这个方法返回一个新的promise对象,该promise对象在iterable里所有的promise对象都成功的时候才会触发成功,一旦有任何一个iterable里面的promise对象失败则立即触发该promise对象的失败。这个新的promise对象在触发成功状态以后,会把一个包含iterable里所有promise返回值的数组作为成功回调的返回值,顺序跟iterable的顺序保持一致;如果这个新的promise对象触发了失败状态,它会把iterable里第一个触发失败的promise对象的错误信息作为它的失败错误信息。Promise.all方法常被用于处理多个promise对象的状态集合。(可以参考jQuery.when方法---译者注)

/**
* Promise.all(iterable) 方法返回一个promise,
* 该promise会等iterable参数内的所有promise都被resolve后被resolve,
* 或以第一个promise被reject的原因而reject 。
* 如果传入的可迭代数组中某项不是一个promise,该项会被用Promise.resolve转换为一个promise。
* 如果任一传入的promise被拒绝了,all Promise立刻带着该promise的拒绝原因进入拒绝(rejected)状态,不再理会其它传入的promise是否被解决。
*/ let p1 = Promise.resolve('1成功');
let p2 = Promise.reject('2失败');
let p3 = Promise.resolve('3成功'); Promise.all([p1,p2,p3])
.then(result => console.log(result))
.catch(err => console.log(err));

Promise.race(iterable)

当iterable参数里的任意一个子promise被成功或失败后,父promise马上也会用子promise的成功返回值或失败详情作为参数调用父promise绑定的相应句柄,并返回该promise对象。

var p1 = new Promise(function(resolve, reject) {
setTimeout(resolve, 500, "一");
});
var p2 = new Promise(function(resolve, reject) {
setTimeout(resolve, 100, "二");
}); Promise.race([p1, p2]).then(function(value) {
console.log(value); // "二"
// 两个都解决,但p2更快
}); var p3 = new Promise(function(resolve, reject) {
setTimeout(resolve, 100, "三");
});
var p4 = new Promise(function(resolve, reject) {
setTimeout(reject, 500, "四");
}); Promise.race([p3, p4]).then(function(value) {
console.log(value); // "三"
// p3更快,所以被解决(resolve)了
}, function(reason) {
// 未被执行
}); var p5 = new Promise(function(resolve, reject) {
setTimeout(resolve, 500, "五");
});
var p6 = new Promise(function(resolve, reject) {
setTimeout(reject, 100, "六");
}); Promise.race([p5, p6]).then(function(value) {
// 未被执行
}, function(reason) {
console.log(reason); // "六"
// p6更快,所以被拒绝(reject了)
});

Promise.reject(reason)

调用Promise的rejected句柄,并返回这个Promise对象。

Promise.resolve(value)

用成功值value完成一个Promise对象。如果该value为可继续的(thenable,即带有then方法),返回的Promise对象会“跟随”这个value,采用这个value的最终状态;否则的话返回值会用这个value满足(fullfil)返回的Promise对象。

异常捕捉

somePromise.then(function() {
return a.b.c.d();
}).catch(TypeError, function(e) {
//If a is defined, will end up here because
//it is a type error to reference property of undefined
}).catch(ReferenceError, function(e) {
//Will end up here if a wasn't defined at all
}).catch(function(e) {
//Generic catch-the rest, error wasn't TypeError nor
//ReferenceError
});

Promise

概念

所谓Promise,简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果。

特点

  1. 对象的状态不受外界影响。Promise 对象代表一个异步操作,有三种状态:Pending(进行中)、Resolved(已完成,又称 Fulfilled)和 Rejected(已失败)。只有异步操作的结果,可以决定当前是哪一种状态,任何其他操作都无法改变这个状态。这也是 Promise 这个名字的由来,它的英语意思就是「承诺」,表示其他手段无法改变。

  2. 一旦状态改变,就不会再变,任何时候都可以得到这个结果。Promise 对象的状态改变,只有两种可能:从 Pending 变为 Resolved 和从 Pending 变为 Rejected。只要这两种情况发生,状态就凝固了,不会再变了,会一直保持这个结果。就算改变已经发生了,你再对 Promise 对象添加回调函数,也会立即得到这个结果。这与事件(Event)完全不同,事件的特点是,如果你错过了它,再去监听,是得不到结果的。

缺点

首先,无法取消 Promise,一旦新建它就会立即执行,无法中途取消。其次,如果不设置回调函数,Promise 内部抛出的错误,不会反应到外部。第三,当处于 Pending 状态时,无法得知目前进展到哪一个阶段(刚刚开始还是即将完成)。

基本语法

var Promise = new Promise(function(resolve, reject) {
if (/* 异步操作成功 */){
resolve(value);
} else {
reject(error);
}
}); promise.then(function(value) {
// success
}, function(value) {
// failure
});

Promise 构造函数接受一个函数作为参数,该函数的两个参数分别是 resolve 方法和 reject 方法。

如果异步操作成功,则用 resolve 方法将 Promise 对象的状态,从「未完成」变为「成功」(即从 pending 变为 resolved);

如果异步操作失败,则用 reject 方法将 Promise 对象的状态,从「未完成」变为「失败」(即从 pending 变为 rejected)。

方法

Promise.all(iterable)

这个方法返回一个新的promise对象,该promise对象在iterable里所有的promise对象都成功的时候才会触发成功,一旦有任何一个iterable里面的promise对象失败则立即触发该promise对象的失败。这个新的promise对象在触发成功状态以后,会把一个包含iterable里所有promise返回值的数组作为成功回调的返回值,顺序跟iterable的顺序保持一致;如果这个新的promise对象触发了失败状态,它会把iterable里第一个触发失败的promise对象的错误信息作为它的失败错误信息。Promise.all方法常被用于处理多个promise对象的状态集合。(可以参考jQuery.when方法---译者注)

/**
* Promise.all(iterable) 方法返回一个promise,
* 该promise会等iterable参数内的所有promise都被resolve后被resolve,
* 或以第一个promise被reject的原因而reject 。
* 如果传入的可迭代数组中某项不是一个promise,该项会被用Promise.resolve转换为一个promise。
* 如果任一传入的promise被拒绝了,all Promise立刻带着该promise的拒绝原因进入拒绝(rejected)状态,不再理会其它传入的promise是否被解决。
*/ let p1 = Promise.resolve('1成功');
let p2 = Promise.reject('2失败');
let p3 = Promise.resolve('3成功'); Promise.all([p1,p2,p3])
.then(result => console.log(result))
.catch(err => console.log(err));

Promise.race(iterable)

当iterable参数里的任意一个子promise被成功或失败后,父promise马上也会用子promise的成功返回值或失败详情作为参数调用父promise绑定的相应句柄,并返回该promise对象。

var p1 = new Promise(function(resolve, reject) {
setTimeout(resolve, 500, "一");
});
var p2 = new Promise(function(resolve, reject) {
setTimeout(resolve, 100, "二");
}); Promise.race([p1, p2]).then(function(value) {
console.log(value); // "二"
// 两个都解决,但p2更快
}); var p3 = new Promise(function(resolve, reject) {
setTimeout(resolve, 100, "三");
});
var p4 = new Promise(function(resolve, reject) {
setTimeout(reject, 500, "四");
}); Promise.race([p3, p4]).then(function(value) {
console.log(value); // "三"
// p3更快,所以被解决(resolve)了
}, function(reason) {
// 未被执行
}); var p5 = new Promise(function(resolve, reject) {
setTimeout(resolve, 500, "五");
});
var p6 = new Promise(function(resolve, reject) {
setTimeout(reject, 100, "六");
}); Promise.race([p5, p6]).then(function(value) {
// 未被执行
}, function(reason) {
console.log(reason); // "六"
// p6更快,所以被拒绝(reject了)
});

Promise.reject(reason)

调用Promise的rejected句柄,并返回这个Promise对象。

Promise.resolve(value)

用成功值value完成一个Promise对象。如果该value为可继续的(thenable,即带有then方法),返回的Promise对象会“跟随”这个value,采用这个value的最终状态;否则的话返回值会用这个value满足(fullfil)返回的Promise对象。

异常捕捉

somePromise.then(function() {
return a.b.c.d();
}).catch(TypeError, function(e) {
//If a is defined, will end up here because
//it is a type error to reference property of undefined
}).catch(ReferenceError, function(e) {
//Will end up here if a wasn't defined at all
}).catch(function(e) {
//Generic catch-the rest, error wasn't TypeError nor
//ReferenceError
});

19-ES6(2)的更多相关文章

  1. React与ES6(四)ES6如何处理React mixins

    React与ES6系列: React与ES6(一)开篇介绍 React和ES6(二)ES6的类和ES7的property initializer React与ES6(三)ES6类和方法绑定 React ...

  2. React与ES6(三)ES6类和方法绑定

    React与ES6系列: React与ES6(一)开篇介绍 React和ES6(二)ES6的类和ES7的property initializer React与ES6(三)ES6类和方法绑定 React ...

  3. React和ES6(二)ES6的类和ES7的property initializer

    React与ES6系列: React与ES6(一)开篇介绍 React和ES6(二)ES6的类和ES7的property initializer React与ES6(三)ES6类和方法绑定 React ...

  4. React与ES6(一)开篇介绍

    React与ES6系列: React与ES6(一)开篇介绍 React和ES6(二)ES6的类和ES7的property initializer React与ES6(三)ES6类和方法绑定 React ...

  5. 深入浅出ES6(十七):展望未来

    作者 Jason Orendorff  github主页  https://github.com/jorendorff 出于对文章长度的考虑,我们还保留了一些尚未提及的新特性,在最后的这篇文章中我会集 ...

  6. 深入浅出ES6(十一):生成器 Generators,续篇

    作者 Jason Orendorff  github主页  https://github.com/jorendorff 欢迎回到深入浅出ES6专栏,望你在ES6探索之旅中收获知识与快乐!程序员们在工作 ...

  7. 深入浅出ES6(八):Symbols

    作者 Jason Orendorff  github主页  https://github.com/jorendorff 你是否知道ES6中的Symbols是什么,它有什么作用呢?我相信你很可能不知道, ...

  8. 深入浅出ES6(六):解构 Destructuring

    作者 Jason Orendorff  github主页  https://github.com/jorendorff 什么是解构赋值? 解构赋值允许你使用类似数组或对象字面量的语法将数组和对象的属性 ...

  9. 深入浅出ES6(二):迭代器和for-of循环

    作者 Jason Orendorff  github主页  https://github.com/jorendorff 我们如何遍历数组中的元素?20年前JavaScript刚萌生时,你可能这样实现数 ...

  10. 与众不同 windows phone (19) - Device(设备)之陀螺仪传感器, Motion API

    原文:与众不同 windows phone (19) - Device(设备)之陀螺仪传感器, Motion API [索引页][源码下载] 与众不同 windows phone (19) - Dev ...

随机推荐

  1. AngularJS基础知识2

    一.angularJS双向数据绑定 利用双向数据绑定,不仅能把数据模型的变化同步到视图上面,还可以利用双向数据绑定的特性来做一些样式上面的控制. 双向数据绑定用处很多,不仅仅是像知识点1中的那个例子, ...

  2. SpringBoot RESTful 应用中的异常处理小结

    转载:https://segmentfault.com/a/1190000006749441 @ControllerAdvice 和 @ExceptionHandler 的区别 ExceptionHa ...

  3. jQuery源代码学习之九—jQuery事件模块

    jQuery事件系统并没有将事件坚挺函数直接绑定在DOM元素上,而是基于事件缓存模块来管理监听函数的. 二.jQuery事件模块的代码结构 //定义了一些正则 // // //jQuery事件对象 j ...

  4. Jquery生成树 ztree

    参考http://www.cnblogs.com/lvchenfeng/p/5295805.html

  5. Molile App(HTTP/HTML)—Record and Analyze Traffic

  6. H5音频和视频

    使用媒体标签最大的缺点在于缺少编解码器的支持一.浏览器支持性检测检测浏览器是否支持audio元素或video元素最简单的方式就是用脚本动态创建它,然后检测特定函数是否存在 var hasVideo=! ...

  7. zjuoj 3780 Paint the Grid Again

    http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemCode=3780 Paint the Grid Again Time Limit: 2 ...

  8. FTF登入tiny210开发板

    配置环境一: 第一步:安装虚拟机             1)安装虚拟机+Linux12.04             2)安装FTP软件 第二步:配置超级终端(串口)             1)开 ...

  9. Extjs 3.4 同值合并

    摘自:http://www.cnblogs.com/kunpengit/archive/2012/11/13/2768239.html/** * grid gridPanel 需要合并的表格 * ro ...

  10. sqlite简单使用

    c创建表: create table 表名称(元素名称 类型,,,): 插入数据:insert into 表名称 values(null,,,) 修改数据   : update 表名 set 字段=’ ...