ES6-Promise(resolve,reject)

⭐ Promise的三个状态:
pending(进行时),fulfilled(已成功),rejected(已失败)

Promise 对象的状态改变，只有两种可能：

• 从 pending 变为 fulfilled 和从 pending 变为 rejected。
• 只要这两种情况发生，则称为 resolved（已定型）。

  配置请求器的基本格式：
  const request = (url, data = {}, method = 'GET') => {
  	return new Promise((resolve, reject) => { 
  		wx.request({
  			url,
  			method,
  			data: { ...data, cross: 1 },
  			success(res) {
  				//返回一个成功的数据 
  				resolve(res.data)
  			},
  			fail(err) {
  				//错误时返回错误信息
  				reject(err.errMsg)
  			}
  		})
  	})
  }

Promise有两个参数,且是函数 — resolve和reject

• async会返回一个promise,可通过传入promise函数来判断它的状态

• resolve(): 成功的回调

• reject()：失败的回调

• .then(resolved的回调函数,rejected的回调函数)：为 Promise 实例添加状态改变时的回调函数，返回的是一个新的Promise实例

• .catch()：发生错误时的回调函数

• .finally()：不管 Promise 对象最后状态如何，都会执行的操作(then方法的特例)

• .all()：用于将多个 Promise 实例，包装成一个新的 Promise 实例

  • const p = Promise.all([p1, p2, p3]);
  1. 只有p1、p2、p3的状态都变成fulfilled，p的状态才会变成fulfilled，此时p1、p2、p3的返回值组成一个数组，传递给p的回调函数。
  2. 只要p1、p2、p3之中有一个rejected，p的状态就变成rejected，此时第一个被reject的实例的返回值，会传递给p的回调函数。

• .allSettled()：确定一组异步操作是否都结束了（不管成功或失败），才会执行下一步

• .any()：等到所有参数 Promise 变成rejected状态才会结束。

Promise.try（）同步函数同步执行，异步函数异步执行

• const f = () => console.log(‘now’);
• Promise.try(f);
• console.log(‘next’);

Promise then第二参数和catch的区别？

• 两者都是用于处理Promise的rejected状态的情况
• then方法的第二个参数
  • 如果Promise的状态变为rejected，then方法的第二个参数会被调用。该参数是一个函数，可以接受一个参数，即Promise返回的错误信息。当Promise被reject时，then方法的第二个参数会被调用，并打印出错误信息
• catch 方法
  • 相当于then方法的第二个参数，也用于处理Promise的rejected状态的情况。不同在于catch方法可以链式调用，而不需要在每次调用then方法时都传递第二个参数。当Promise被reject时，catch方法会被调用，并打印出错误信息

async 函数的返回值

• async函数在抛出返回值时，会根据返回值类型开启不同数目的微任务
  • 如果返回值为 非then，非promise， 则不等待其他结果，先返回自身
  • 如果返回值为 then， 则等待1个then的时间，然后返回自身，再继续往下走
  • 如果返回值为 promise， 则等待2个then的时间，然后返回自身，再继续往下走(等待就是执行promise中的then)
• 例子：

  // 返回值为 非then，非promise
  async function testA () {
  		return 1;
  }
  
  testA().then(() => console.log(1));
  Promise.resolve()
  	.then(() => console.log(2))
  	.then(() => console.log(3));
  // 1 2 3
  
  // 返回值为 then
  async function testB () {
  	return {
  		then (cb) {
  				cb();
  		}
  	};
  }
  
  testB().then(() => console.log(1));
  Promise.resolve()
  	.then(() => console.log(2))
  	.then(() => console.log(3))
  // 2 1 3
  
  // 返回值 promise
  async function testC () {
  	return new Promise((resolve, reject) => {
  		resolve()
  	})
  } 
  
  testC().then(() => console.log(1));
  Promise.resolve()
  		.then(() => console.log(2))
  		.then(() => console.log(3))
  		.then(() => console.log(4))
  // 2 3 1 4
  
  
  async function async1 () {
  	console.log('1') ------------------------------ 2 执行async1函数，得到1
  	await async2() -------------------------------- 3 执行async2函数
  	console.log('AAA') ---------------------------- 9 等待async2函数执行完，得到AAA
  }
  
  async function async2 () {
  	console.log('3') ------------------------------ 3 执行async2函数，得到3
  	return new Promise((resolve, reject) => {
  			resolve() --------------------------------- 5 执行Promise，返回值为Promise，等待两个then
  			console.log('4') -------------------------- 4 Promise构造器中代码属于同步代码，得到4
  	})
  }
  
  console.log('5')		------------------------------- 1 同步代码先执行
  
  setTimeout(() => {
  	console.log('6') ------------------------------ 11 放入宏任务异步队列中
  }, 0);
  
  async1() ------------------------------------------ 2 执行async1函数
  
  new Promise((resolve) => {
  	console.log('7') ------------------------------ 5 执行Promise，得到 7
  	resolve()
  }).then(() => {
  	console.log('8') ------------------------------ 7 等待第一个then，得到 8
  }).then(() => {
  	console.log('9') ------------------------------ 8 等待第二个then，得到 9
  }).then(() => {
  	console.log('10') ----------------------------- 10 执行最后一个微任务then，得到 10
  })
  console.log('11') --------------------------------- 6 同步代码，得到 11

await 右值类型区别

• 非 then：会立即向微任务队列添加一个微任务then，但不需等待
• then：需要等待一个 then 的时间之后执行
• promise：接Promise类型(有确定的返回值)，会立即向微任务队列添加一个微任务then，但不需等待
• 示例：

  /*then*/
  async function test () {
  	console.log(1);
  	await {
  		then (cb) {
  			cb();
  		},
  	};
  	console.log(2);
  }
  
  test();
  console.log(3);
  
  Promise.resolve()
  	.then(() => console.log(4))
  	.then(() => console.log(5))
  	.then(() => console.log(6))
  	.then(() => console.log(7));
  
  //  1 3 4 2 5 6 7
  
  /*promise*/
  async function test () {
  	console.log(1);
  	await new Promise((resolve, reject) => {
  		resolve() // 保持pending
  	})
  	console.log(2);
  }
  
  test();
  console.log(3);
  
  Promise.resolve()
  	.then(() => console.log(4))
  	.then(() => console.log(5))
  	.then(() => console.log(6))
  	.then(() => console.log(7));
  
  //  1 3 2 4 5 6 7

promise.race

• 接受一个 Promise 数组并返回一个新的 Promise
• 返回的 Promise 将解析或拒绝其中一个 Promise 解析或拒绝的第一个值。
• 示例：

  type Fn = (...params: any[]) => Promise<any>;
  
  function timeLimit(fn: Fn, t: number): Fn {
    return async function(...args) {
      const timeLimitPromise = new Promise((resolve, reject) => {
        setTimeout(() => reject("Time Limit Exceeded"), t)
      });
      return Promise.race([timeLimitPromise, fn(...args)]);
    }
  };