时间戳

首页 > 解决方案 > 如何声明一个promise变量，以便在promise得到解决之前我可以在任何地方使用它

javascript - 如何声明一个promise变量，以便在promise得到解决之前我可以在任何地方使用它

问题描述

在解决之前，我在使用 Promise 解析代码时遇到问题。

我有多个页面哪个页面首先加载对我来说很难说，来自多个承诺的解析数据被所有开发人员使用。

这是我从多个承诺中获取解析数据的方法

asyncCompletedPromise = Promise.all([getUserCollection(), getDefaultSettings(), getGroupUsersDetails()]).then((values) => {
  console.log('all promises are done');
  console.log(values);
  return values;
});

问题：如何将此asyncCompletedPromise变量作为基于承诺的变量，以便我可以在重新使用承诺之前使用它。

这是工作演示：

var asyncCompletedPromise = Promise, apiCompletedTracker = {};

function getUserCollection(){
    return new Promise(function(resolve,reject){
        $.ajax({
            url: 'https://jsonplaceholder.typicode.com/users',
            type: 'GET',
            dataType:'json',
            success: function(data){
               console.log('getUserCollection api completed');
               apiCompletedTracker['getUserCollection'] = 'completed';
               resolve({user:data});
            }
        });
    });
}

function getDefaultSettings(){
   return new Promise(function(resolve,reject){
     $.ajax({
        url: 'https://jsonplaceholder.typicode.com/users',
        type: 'GET',
        dataType:'json',
        success: function(data){
            setTimeout(function(){
              console.log('getDefaultSettings api completed');
              apiCompletedTracker['getDefaultSettings'] = 'completed';
              resolve({default:data});
            },1500);
        }
    })
   });
}

function getGroupUsersDetails(){
   return new Promise(function(resolve,reject){
     $.ajax({
        url: 'https://jsonplaceholder.typicode.com/posts',
        type: 'GET',
        dataType:'json',
        success: function(data){
            setTimeout(function(){
              console.log('getGroupUsersDetails api completed');
              apiCompletedTracker['getGroupUsersDetails'] = 'completed';
              resolve({group:data});
            },2500);
        }
    })
   });
}

// when all of the above function completes i can apply 


asyncCompletedPromise = Promise.all([getUserCollection(), getDefaultSettings(), getGroupUsersDetails()]).then((values) => {
  console.log('all promises are done');
  //console.log(values);
  return values;
});


asyncCompletedPromise.then(function(values){
   console.log('variable used first time');
});


asyncCompletedPromise.then(function(values){
   console.log('variable used second time');
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

当我在解决asyncCompletedPromise所有承诺之前使用变量时，Promise.all()代码给出错误

var asyncCompletedPromise = Promise, apiCompletedTracker = {};

function getUserCollection(){
    return new Promise(function(resolve,reject){
        $.ajax({
            url: 'https://jsonplaceholder.typicode.com/users',
            type: 'GET',
            dataType:'json',
            success: function(data){
               console.log('getUserCollection api completed');
               apiCompletedTracker['getUserCollection'] = 'completed';
               resolve({user:data});
            }
        });
    });
}

function getDefaultSettings(){
   return new Promise(function(resolve,reject){
     $.ajax({
        url: 'https://jsonplaceholder.typicode.com/users',
        type: 'GET',
        dataType:'json',
        success: function(data){
            setTimeout(function(){
              console.log('getDefaultSettings api completed');
              apiCompletedTracker['getDefaultSettings'] = 'completed';
              resolve({default:data});
            },1500);
        }
    })
   });
}

function getGroupUsersDetails(){
   return new Promise(function(resolve,reject){
     $.ajax({
        url: 'https://jsonplaceholder.typicode.com/posts',
        type: 'GET',
        dataType:'json',
        success: function(data){
            setTimeout(function(){
              console.log('getGroupUsersDetails api completed');
              apiCompletedTracker['getGroupUsersDetails'] = 'completed';
              resolve({group:data});
            },2500);
        }
    })
   });
}

// Note below line, i want to use it somewhere before it is actually resolved
asyncCompletedPromise.then(function(values){
   console.log('called before all promises are resolved,giving error, error should not happen irrespective calling it anywhere');
});

// when all of the above function completes i can apply


asyncCompletedPromise = Promise.all([getUserCollection(), getDefaultSettings(), getGroupUsersDetails()]).then((values) => {
  console.log('all promises are done');
  //console.log(values);
  return values;
});


asyncCompletedPromise.then(function(values){
   console.log('variable used first time');
});


asyncCompletedPromise.then(function(values){
   console.log('variable used second time');
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

标签： javascriptjquerypromise

解决方案

这与承诺无关。在为变量赋值之前，您不能使用该变量，点。

请注意，即使在您的第一个工作片段中，您也正在使用该变量，然后它所持有的承诺与 ajax 响应异步实现。

推荐阅读