promise 学习笔记

  1 //promise基本用法
  2 // var p = new Promise(function(resolve,reject){
  3 
  4 // }).then(function(data){
  5 
  6 // }).then(function(data){
  7 
  8 // }).then.....
  9 
 10 /*
 11 Promise接受一个回调函数,回调函数接收两个参数,resolve(将Promise的状态从pending变为fulfilled,
 12 在异步操作成功时调用,并将异步操作的结果传递出去)、reject(将Promise的状态从pending变为rejected,在异步操作失败时调用,
 13 将异步操作的错误作为参数传递出去)这两个都是函数,表示成功和失败的处理函数。then中接受的是上一次回调返回的结果,所以这样的链式调用就可以完全清晰的实现多层调用。
 14 */
 15 
 16 /*Promise对象有两个特点: 
 17 ①,对象的状态不受外界的影响,Promise有三种状态:Pending(进行中)、fulfilled(已成功)、rejected(失败),只用异步操作的结果可以决定当前是哪一种状态,其他任何操作都无法改变这个操作。 
 18 ②.一旦状态改变之后就不会再改变。任何时候都可以得到这个结果。状态变化只有两种可能:从pending到fulfilled和从pending到rejected。只要改变就已经定型了。
 19 */
 20 
 21 //这里说明promise是创建就执行的
 22 let p = new Promise(function (resolve,reject) {
 23     console.log('start');
 24     resolve();
 25     //reject();
 26 });
 27 setTimeout(function(){
 28     console.log("setTimeout");
 29 },0);//这里是下个事件循环开始才会执行
 30 
 31 p.then(function () {//这里触发resolve后运行
 32     console.log('resolve');
 33     return 'success';
 34 },function () {//这里触发reject后运行
 35     console.log('reject');
 36     return 'error';
 37 }).then(function (params) {
 38     console.log(params);
 39 });//这里params参数获取到了上一个then函数返回的aaa
 40 
 41 console.log('async running');
 42 /*
 43 执行打印:
 44 start
 45 async running
 46 resolve
 47 success
 48 setTimeout
 49 */
 50 
 51 
 52 //promise捕捉错误
 53 let p1 = new Promise(function (resolve, reject) {
 54     resolve();
 55     reject('reject');
 56 });
 57 
 58 p1.then(function () {
 59     console.log('resolve');
 60     foo + 1; //这里写一段错误代码
 61 }, function (params) {
 62     console.log(params);
 63 }).catch(function (reason) { //参数为错误信息
 64     console.log('捕捉catch错误'); //捕捉到这个错误
 65     //console.log(reason);//打印错误信息
 66 });
 67 
 68 
 69 console.log('test'); //这里正常执行了
 70 /*
 71     reject抛出错误 被then的第二个回调函数捕获获取参数打印 一般来说then的第二个回调函数或者catch都能捕获错误  个人推荐后者 一目了然
 72 */
 73 
 74 
 75 //Promise.resolve方法
 76 let obj = {
 77     then: function (resolve, reject) {
 78         //resolve(42);
 79         reject(45);
 80     }
 81 };
 82 //可以把一般对象转换成promise对象 前提是有then方法  状态可以为resolve或者reject 视情况而定
 83 let p2 = Promise.resolve(obj);
 84 //也可以直接传参let p2 = Promise.resolve('resolve');
 85 p2.then(function (params) {
 86     console.log(params);
 87 }).catch(function (reason) {
 88     console.log(reason);
 89 });
 90 
 91 //Promise.all方法 
 92 let pa1 = new Promise(function (resolve, reject) {
 93     setTimeout(() => {
 94         resolve('3s timeout');
 95     }, 0);
 96 });
 97 
 98 let pa2 = Promise.resolve('test');
 99 let pa3 = Promise.resolve('a');
100 
101 //这里会等待数组里的所有promise对象都决议之后才会调用then方法
102 Promise.all([pa1, pa2, pa3]).then(function (data) {
103     console.log('开始执行then函数');
104     console.log(data); //[ '3s timeout', 'test', 'a' ]  这里输出所有promise成为resolve状态后传入的参数
105 }).catch(function (reason) {
106     console.log(reason);
107 })
108 
109 
110 //Promise.race方法
111 let pr1 = new Promise(function (resolve,reject) {
112     setTimeout(() => {
113         resolve('5s timeout');
114     }, 60000);
115 });
116 let pr2 = new Promise(function (resolve,reject) {
117     setTimeout(() => {
118         resolve('3s timeout');
119     }, 3000);
120 });
121 let pr3 = new Promise(function (resolve,reject) {
122     setTimeout(() => {
123         resolve('1s timeout');
124     }, 1000);
125 });
126 
127 //这里会返回第一个决议的promise对象
128 Promise.race([pr1,pr2,pr3]).then(function (data) {
129     console.log(data);//1s timeout
130 }).catch(function (reason) {
131     console.log(reason);
132 });
133 
134 //Promise.reject  生成状态为rejected的Promise实例。
135 let error = 'error';
136 let ep = Promise.reject(error);
137 
138 ep.then(function () {
139     console.log("resolved");
140 }).catch(function (e) {
141     console.log(e === error) //true
142     console.log(e) //Hello
143 })
原文地址:https://www.cnblogs.com/tudou1223/p/9946692.html