Javascript 在发生异步事件时,在Promise.all()中更改承诺的承诺状态
我正在使用谷歌地图Api。我有两个异步事件,库API调用和页面用户的位置请求。在使用Javascript 在发生异步事件时,在Promise.all()中更改承诺的承诺状态,javascript,google-maps-api-3,async-await,promise,es6-promise,Javascript,Google Maps Api 3,Async Await,Promise,Es6 Promise,我正在使用谷歌地图Api。我有两个异步事件,库API调用和页面用户的位置请求。在使用getCurrentPosition的geologe()函数中,我检索用户的坐标,如果一切正常,该函数将返回一个处于已解析状态的承诺,位置为值。要加载API库,我正在使用JSONP,并在loadGoogleAPI()中动态添加一个脚本,当库准备就绪时,调用回调函数GoogleAppLoaded。当上述2个异步事件发生时,我必须继续“异步执行”,并且我正在使用useGoogleMapsApi()函数中的并行执行模式
getCurrentPosition
的geologe()函数中,我检索用户的坐标,如果一切正常,该函数将返回一个处于已解析状态的承诺,位置为值。要加载API库,我正在使用JSONP,并在loadGoogleAPI()
中动态添加一个脚本,当库准备就绪时,调用回调函数GoogleAppLoaded
。当上述2个异步事件发生时,我必须继续“异步执行”,并且我正在使用useGoogleMapsApi()函数中的并行执行模式(wait Promise.all
)。
我的问题是,当我调用Promise.all
时,googleAPIStatus
的Promise.all
绑定到其初始值newpromise(()=>{})
待定的Promise。加载带有JSONP的库时,我使用变量的值googleAPIStatus=Promise.resolve()
将其更改为已解析的Promise,但Promise。所有的都与初始挂起的Promise值相关。
这是代码。我该如何解决
let googleAPIStatus = new Promise(()=>{});
function googleAPILoaded(){
console.log('loaded');
googleAPIStatus = Promise.resolve();
}
function useGoogleMapsApi(){
loadGoogleAPI();//JSONP with a dynamic script
let [_,posizione]= await Promise.all([googleAPIStatus , geolocate()]); //parallel execution pattern
//Here if resolved either the Promises
}
function loadGoogleAPI(){
let isLibraryLoaded = document.querySelector("script[src='google-api']");
if(!(typeof google === 'object' && typeof google.maps === 'object')){
//Add dynamic script that load the library
let script = document.createElement('script');
script.type='text/javascript';
script.src = 'https://maps.googleapis.com/maps/api/js?key=HEREMYKEY&libraries=places&callback=googleAPILoaded';
script.id = 'google-api';
if(!isLibraryLoaded)
document.body.appendChild(script);
else
isLibraryLoaded.parentNode.replaceChild(script,isLibraryLoaded);
}
}
您可以公开googleAPIStatus
Promise
的结算,以便在googleapiroaded
回调中结算其状态
让我们解决,拒绝;
让googleAPIStatus=新承诺((你决定,你拒绝)=>{
决心=_决心;
拒绝=_拒绝;
});
函数GOOLEADED(){
console.log('loaded');
解决()
}
setTimeout(googleaded,100);
然后(()=>console.log(“resolved”)
另一个答案建议公开解析器函数,它是“延迟模式”,这是一种反模式,在可能的情况下要避免,因为它的封装性差
相反,请考虑:“如果每个API都支持承诺,我将如何编写此脚本?”
然后通过包装在promise构造函数()中遇到的所有遗留非promise API来创建这种现实,或者更好地,寻找更新的API
在您的情况下,已经存在一种等待加载脚本的更简单方法:
异步函数loadGoogleAPI(){
if(typeof google=='object'&&typeof google.maps=='object'){
返回;
}
//添加加载库的动态脚本
const script=document.body.appendChild(document.createElement('script');
script.type='text/javascript';
script.src=https://maps.googleapis.com/maps/api/js?key=HEREMYKEY&libraries=places';
script.id='googleapi';
等待新承诺(resolve=>script.onload=resolve);
}
(异步()=>{
试一试{
等待加载googleapi();
log(typeof google.maps);
}捕获(e){
控制台日志(e);
}
})();代码>智能解决方案。这正是我要找的。我已经在我的代码上测试了它,它完成了这项工作。我不明白是谁否决了我的问题。此外,我无法插入最小的可执行代码,因为密钥API不是免费的。