Promise:

解决异步回调问题

传统方式使用的话:大部分用回调函数,事件


  • 使用时可以:
<script > let a = 10; // 返回Promise对象 let Promis = new Promise(function (resolve, reject) {
     //resolve 成功的时候调用 // reject 失败的时候调用 if (a == 10) {
     resolve('成功'); } else {
     reject('失败'); } }); </script>
  • 其中上面的Promis可以接受resolve / reject来进行下一步操作
<script > // Promis.then(res=>{
     // // },err=>{
     // // }) // 如: Promis.then(res=>{
     console.log(res); },err=>{
     console.log(err); }) </script>
  • 使用catch来接收报错:
<script > let a = 10; // 返回Promise对象 let Promis = new Promise(function (resolve, reject) {
     //resolve 成功的时候调用 // reject 失败的时候调用 if (a == 10) {
     resolve('成功'); } else {
     reject('失败'); } }); // reject,发生错误的别名 Promis.catch(err => {
     console.log(err); }) </script>
  • 处理Promise的resolve / reject时,也可以使用 . 连接:
<script > let a = 10; // 返回Promise对象 let Promis = new Promise(function (resolve, reject) {
     //resolve 成功的时候调用 // reject 失败的时候调用 if (a == 10) {
     resolve('成功'); } else {
     reject('失败'); } }); //此处可以直接使用 .连接 Promis.then(res => {
     console.log(res); }).catch(err => {
     console.log(err); }) </script>

也可以使用then() 来接收resolve / reject 的结果

<script > new Promise().then(res=>{
      },err=>{
      }) </script>
  • 将现有东西转成一个promise对象
<script > let a = 10; // 返回Promise对象 let Promis = new Promise(function (resolve, reject) {
     //resolve 成功的时候调用 // reject 失败的时候调用 if (a == 10) {
     resolve('成功'); } else {
     reject('失败'); } }); Promise.resolve('aa'): // 将现有东西转成一个promise对象,resolve状态,成功状态 // 等价于: new Promise(resolve => {
     resolve('aaa') }); // 或者: Promise.reject('aaa'): // 将现有东西转成一个promise对象,reject状态,失败状态 // 等价于: new Promise(reject => {
     reject('aaa') }); </script>
  • promise可以传递状态 resolve / reject:
<script > p1 = new Promise(resolve => {
     resolve('aaa') }); p1.then(res => {
     console.log(res); }) </script>
  • Promise.all():

把promise打包,打包完还是一个promise对象

若是其中传入的一个promise对象的状态与其他promise状态不符,会导致报错(必须确保里面所有promise对象都是resolve状态才靠谱)

如:

<script > let p1 = Promise.resolve('aaa'); let p2 = Promise.resolve('bbb'); let p3 = Promise.resolve('ccc'); Promise.all([p1, p2, p3]).then(res => {
     // console.log(res); let [res1, res2, res3] = res; console.log(res1, res2, res3); }) </script>
  • Promise.race():

只要用一个成功就返回,如:

<script > let p1 = Promise.resolve('aaa'); let p2 = Promise.reject('bbb'); let p3 = Promise.resolve('ccc'); Promise.race([p1, p2, p3]).then(res => {
     console.log(res); }).catch(err => {
     console.log(err); }) </script>
  • demo_练习:
<script > // 用户登录成功 / 失败 练习 let status = 1; let userLogin = (resolve, reject) => {
     setTimeout(() => {
     if (status == 1) {
     resolve({
    data: '登陆成功', msg: 'asfasfas', token: 'asfyuiofdgb'}); } else {
     reject('失败了'); } }, 2000) }; let getUserInfo = (resolve, reject) => {
     setTimeout(() => {
     if (status == 1) {
     resolve({
    data: '获取用户成功', msg: 'asfasfas', token: 'asfyuiofdgb'}); } else {
     reject('失败了'); } }, 1000) }; new Promise(userLogin).then(res => {
     console.log('用户登录成功'); return new Promise(getUserInfo); }).then(res => {
     console.log('获取用户信息成功'); console.log(res); }) </script>