Web 技术研究所

我一直坚信着,Web 将会成为未来应用程序的主流

浏览器自带的Promise对象

  很早以前jQuery中就有了Deferred对象,它提供了一系列便于异步操作的功能。Chrome从32版开始原生支持了Promise对象,Firefox25也支持,但默认没有开启,需要手动配置dom.promise.enabled。总之目前这个对象的兼容性并不好。

  Promise构造器的构造参数需要一个回调函数,这个回调函数会被同步执行,并传入两个参数resolvereject。这两个参数都是函数,调用他们会使promise实例进入相应的状态。
  Promise构造器的prototype上还有两个方法,分别是thencatch。这两个方法的参数也是回调函数,这些函数会在promise实例进入不同状态后被调用。then对应到resolvecatch对应到reject。注意,这个调用是异步进行的,而且它很慢,会有若干毫秒的延迟,至少比setTimeout慢。
<script>
setTimeout(function(){
  console.log("msg1");
});
new Promise(function(resolve,reject){
  resolve();
  console.log("call");
  setTimeout(function(){
    console.log("msg2");
  });
}).then(function(){
  console.log("then");
});
</script>

  除了这些之外,Promise构造器上还直接提供了一组静态方法。
  Promise.resolve(value)Promise.reject(reason),这两个方法都是直接生成一个进入相应状态的promise对象,其参数就是进入相应状态时传递过去的参数,可以在完成回调的参数中得到。
Promise.resolve("resolve-then").then(function(e){
  console.log(e);
});
Promise.reject("reject-catch").catch(function(e){
  console.log(e);
});
  上面这两个方法是Firefox27和Chrome33都支持的,之后的几个方法Firefox暂不支持
  Promise.all(iterable),参数是一个数组,只有这个数组中的所有promise实例都resolve之后才会触发其返回的promise实例的then;只要其中有任何一个promise实例被reject,那么最终的promise实例将触发catch。触发then时会带上iterable参数中的所有值,其中的promise实例会被其结果值替代。
<script>
Promise.all([
  Promise.resolve(1),
  Promise.resolve(2),
  Promise.resolve(3)
]).then(function(e){
  console.log(e); //[1,2,3]
});
Promise.all([
  Promise.resolve(1),
  Promise.resolve(2),
  Promise.reject(3)
]).catch(function(e){
  console.log(e); //3
});
</script>
  Promise.race(iterable),参数是一个数组,这个数组中的任意promise实例首次resolvereject时作用到它返回的promise实例上。
<script>
Promise.race([
  new Promise(function(resolve,reject){
    setTimeout(reject,300,"300");
  }),
  new Promise(function(resolve,reject){
    setTimeout(resolve,200,"200");
  })
]).then(function(e){
  console.log(e); //200
});
</script>
  Promise.cast(reason),和Promise.resolve(value)类似,但是对于参数是promise实例时的处理方式有所不同。cast方法对其参数是promise实例时直接返回这个实例,而resolve方法则会创建一个与之同步的新resolve对象。
<script>
var p=new Promise.reject();
console.log(Promise.cast(p)==p);
console.log(Promise.resolve(p)==p);
</script>
网名:
54.144.24.*
电子邮箱:
仅用于接收通知
提交 悄悄的告诉你,Ctrl+Enter 可以提交哦
神奇海螺
[查看全部主题]
各类Web技术问题讨论区
发起新主题
本模块采用即时聊天邮件通知的模式
让钛合金F5成为历史吧!
次碳酸钴的技术博客,文章原创,转载请保留原文链接 ^_^