运行函数之前如何确保异步请求已完成

我正在执行异步请求以从服务器中提取数据，然后在请求后调用函数。我的问题是如何确保请求已完成，并且在processRecords（）运行之前加载了所有数据？运行函数之前如何确保异步请求已完成

在此先感谢。

function getRecords() { 
    var ids = Server.getIds(); 
    var allTheRecords = []; 

    ids.forEach(function(recordId) { 
    Server.getRecord(recordId, function (error, data) { 
     if(error) { 
     console.log(error); 
     } else { 
     allTheRecords.push(data); 
     }; 
    }); 
    }); 

    processRecords(allTheRecords); 
}

来源

2016-12-03 Luke Aveil

你可以使用本地Promise API执行异步操作为您服务。

使用Promise.all您可以给它一个承诺数组，在调用processRecords函数之前需要解决。

它现在也更具可重用性，因为您可以在代码中的其他地方使用getRecord函数。

如果你控制它，你应该想办法增加从服务器获取多个记录的能力。如果你只用一个网络请求，你并不是真的想要解雇一堆网络请求。

// Server mock of the api you have shown 
 
const Server = { 
 
    getRecord(id, callback) { 
 
    console.log('getRecord', id) 
 
    callback(null, {id}) 
 
    }, 
 
    getIds() { 
 
    return [1, 2, 3] 
 
    } 
 
} 
 

 
function getRecords (ids, processRecords) { 
 
    console.log('getRecords', ids.join()) 
 
    // mapping the array of id's will convert them to an 
 
    // array of Promises by calling getRecord with the id 
 
    Promise.all(ids.map(getRecord)) 
 
    // then is called once all the promises are resolved 
 
    .then(processRecords) 
 
    // this will be called if the reject function of any 
 
    // promise is called 
 
    .catch(console.error.bind(console)) 
 
} 
 

 
function getRecord(recordId) { 
 
    // this function returns a Promise that wraps your 
 
    // server call 
 
    return new Promise((resolve, reject) => { 
 
    Server.getRecord(recordId, function (error, data) { 
 
     if(error) { 
 
     reject(error) 
 
     } else { 
 
     resolve(data) 
 
     } 
 
    }) 
 
    }) 
 
} 
 

 
getRecords(Server.getIds(), function(records) { 
 
console.log('resolved all promises') 
 
console.log(records) 
 
})

来源

2016-12-03 13:08:04 synthet1c

感谢您的反馈。不知道我理解或遵循，虽然：/我无法访问getRecord函数，因为它是在一个server.js文件中，为此练习的目的我无法访问此文件。我已经读过关于承诺但尚未实现的任何内容。 –

@LukeAveil找出它在做什么的最好方法是在devtools中放置断点并在执行代码时逐步执行代码。我已经使用服务器api的模拟对它进行了一些修改，所以它在代码片段 – synthet1c

你是如何执行异步请求？如果这是一个AJAX请求，API将根据调用的结果提供回调。

https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest

来源

2016-12-03 13:25:18

中工作。请求被执行'''Server.getRecord（）'''。不幸的是，这不是一个AJAX请求......这就是为什么我有点挣扎。 –

'服务器'从哪里来？你在使用什么API。 –

运行函数之前如何确保异步请求已完成

回答

相关问题