[英]Javascript - How to wait event listener end to next iteration
I am facing problems with an event listener inside a for loop.我在 for 循环中遇到事件侦听器的问题。
I have basically this:我基本上是这样的:
for (var i = 0; i < 2; i++) { //window url change here, each iteration open a different url console.log('what??'); window.addEventListener('load', aperture, true); function aperture() { console.log('here'); window.close(); } }
So, I have to wait window load in order to execute the function, and then go to next for iteration and do the same.因此,我必须等待窗口加载才能执行该函数,然后转到 next 进行迭代并执行相同的操作。 But what I obtain looking this logs is:但是我通过查看此日志获得的是:
what??
what??
here
here
How can I wait event listener finish between iterations ?如何在迭代之间等待事件侦听器完成?
I'll just answer the question you actually asked...我就回答你实际问的问题...
How can I wait event listener finish between iterations ?如何在迭代之间等待事件侦听器完成?
You can't do it with a real loop, the only way to make an asynchronous "loop" is to use recursion, which can be slightly complicated.你不能用真正的循环来做到这一点,制作异步“循环”的唯一方法是使用递归,这可能有点复杂。 The idea is to create a function that will call itself when it's ready to iterate again.这个想法是创建一个函数,当它准备好再次迭代时会调用自己。
(function myLoop(){ // do something that takes a while setTimeout(function(){ console.log("did something"); // then recurse... myLoop(); }, 1500); })();
If you're looping over an array, the concept is similar... Here's a general purpose function I wrote to do do it...如果你在一个数组上循环,这个概念是相似的......这是我写的一个通用函数来做到这一点......
var myArray = ["a","b","c","d"]; var myLoop = slowLoop(myArray, (itm, idx, cb)=>{ setTimeout(()=>{ console.log(`doing something with ${itm} which is item number ${idx} in the array`); // call cb when finished cb(); }, 1000); }); // when it's done.... myLoop.then(()=>{ console.log("All done looping"); }); /** * Execute the loopBody function once for each item in the items array, * waiting for the done function (which is passed into the loopBody function) * to be called before proceeding to the next item in the array. * @param {Array} items - The array of items to iterate through * @param {Function} loopBody - A function to execute on each item in the array. * This function is passed 3 arguments - * 1. The item in the current iteration, * 2. The index of the item in the array, * 3. A function to be called when the iteration may continue. * @returns {Promise} - A promise that is resolved when all the items in the * in the array have been iterated through. */ function slowLoop(items, loopBody) { return new Promise(f => { done = arguments[2] || f; idx = arguments[3] || 0; let cb = items[idx + 1] ? () => slowLoop(items, loopBody, done, idx + 1) : done; loopBody(items[idx], idx, cb); }); }
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.