模拟JavaScript的setTimeout()方法"从第一原则"

Question

我正在尝试通过Firefox的Scratchpad在网站上运行setTimeout((。似乎有关于这个特定的JavaScript方法的各种Firefox错误 - 它是双胞胎，setInterval()。在 Firefox v.56 和最新的 Waterfox(都是"Quantum"之前(中，这些 JavaScript 方法似乎根本不起作用。相比之下，在Firefox"量子"版本中，它似乎确实有效......也就是说，相同的代码在FF"Quantum"中工作，而在Firefox的"Quantum"版本之前就不起作用。是的，我尝试了各种变化。

在这种情况下，我在这个练习中坚持使用Firefox的Pre-Quantum版本，我需要找到一种方法来从第一原理"构建"这个setTimeout()方法，就像它一样。

一个想法是获取当前日期/时间，然后循环检查以查看是否已经过去了 10 秒(或 5 分钟(，然后再继续执行进一步的代码/脚本。

任何想法如何使用JavaScript有效地模拟setTimeout()资源，但没有setTimeout()或setInterval()？

---

---编辑---

误报...也可以让setInterval()在旧浏览器中工作;我的坏！

(这意味着提出问题的原因已经消失，但这样的问题可能会保留......

---

---第2次编辑

---而setTimeout()在这里工作：

setTimeout(function(){ alert("Hello"); }, 3000);

它不起作用/似乎在这里被忽略了：

i=0;
while(i < 100)
{
// window.open("https://www.cnn.com","_self");
// window.open("https://www.bbc.com","_self");
// setTimeout(function(){ alert("Hello"); }, 3000);
setTimeout(function(){ window.open("https://www.bbc.com","_self") }, 3000);
setTimeout(function(){ window.open("https://www.cnn.com","_self") }, 3000);
alert(i);
i++;
}
// security mgr vetoed ???

• 为什么？

Answer 1

如果你真的真的想在不阻塞浏览器等的情况下模拟setTimeout函数，你可以尝试使用requestAnimationFrame函数来获得一些延迟。它应该在Firefox 14.0+中工作。像这样：

function mySetTimeout (callback, timeout) {
var startTime = performance.now();
function mySetTimeoutRec () {
requestAnimationFrame(function () {
// This way this function will be called
// asynchronously around 60 times per second
// (or less frequently on the inactive tabs).
// We can check that enough time has passed
// and call the user callback or this function again.
var currentTime = performance.now();
var elapsedTime = currentTime - startTime;
if (elapsedTime < timeout) {
mySetTimeoutRec();
} else {
callback();
}
});
}
mySetTimeoutRec();
}

它可以像setTimeout一样使用：

mySetTimeout(function () { console.log('Howdy.'); }, 10 * 1000);

无论如何，在大多数情况下，您不应该尝试做这样的事情。如果您似乎对setTimeout有问题，那可能是其他问题。

Answer 2

一种可能性是利用需要可变秒数才能完成的网络请求：

function artificialSetTimeout(fn, timeout) {
const xhr = new XMLHttpRequest();
xhr.onreadystatechange = () => {
if (xhr.readyState === 4 && xhr.status === 200) fn();
}
xhr.open('get', 'https://httpstat.us/200?sleep=' + timeout);
xhr.send();
}
console.log('start');
artificialSetTimeout(() => console.log('end'), 2000);

不过，不要依赖它的时间完全准确。