zoukankan      html  css  js  c++  java
  • 使用Promise链式调用解决多个异步回调的问题

    使用Promise链式调用解决多个异步回调的问题

    比如我们平常经常遇到的一种情况:

    网站中需要先获取用户名,然后再根据用户名去获取用户信息。这里获取用户名getUserName()和获取用户信息getUser()都是调用接口的异步请求。在获取用户信息之前,需要先获得用户名。也就是说getUser依赖于getUserName的状态。

    一:promise.all()

    function getUserPromise(promiseX, promiseY){
     return Promise.all([promiseX, promiseY])
     .then(values =>
     // 返回的values由 promiseX 与 promiseY返回的值所构成的数组。
      values
     )
    }
    function getUserName(){
     let data = 'superman';
     return new Promise((resolve, reject) => {
      setTimeout(resolve(data), 1000);
     })
    }
    function getUser(){
     let data = {
     id:1,
     username: 'superman',
     gender: 'male'
     }
     return new Promise((resolve, reject) => {
     setTimeout(resolve(data), 2000);
     })
    }
    getUserPromise(getUserName(), getUser())
    .then(data => {
     // 这里的data就是包含了getUserName 和 getUser返回值所组成的数组
     console.log(data); // [ 'superman', { id: 1, username: 'superman', gender: 'male' } ]
     })
    

      

    二:链式调用

    function getUserName(){
     let data = 'superman';
     return new Promise((resolve, reject) => {
     setTimeout(resolve(data), 4000);
     })
    }
    function getUser(username){
     let data = {
     id:1,
     username: 'superman',
     gender: 'male'
     }
     return new Promise((resolve, reject) => {
     if(username){
      setTimeout(resolve(data), 2000);
     }
     else{
      reject('err');
     }
     })
    }
    getUserName().then(username => {
     return getUser();
    })
    .then(user => {
     console.log(user);
    })
    .catch(err => {
     console.log(err);
    })
    

      

  • 相关阅读:
    ar游戏开发入门三步走
    什么是 OpenCL OpenGL
    https 服务器搭建
    javascript 访问cookie信息
    手机网页制作需要注意的一点东西
    asp.net下载文件几种方式
    javascriptM
    PDF转JPG
    java实现PDF转HTML
    关于mysql ERROR 1045 (28000)错误的解决办法
  • 原文地址:https://www.cnblogs.com/momozjm/p/8603007.html
Copyright © 2011-2022 走看看