如果用户切换到另一个 window,异步功能会暂停吗
Do async function get paused, if the user switch over another window
基本上我创建了一个JavaScript项目
这里的问题是,当用户切换到另一个 window 时,for 循环继续工作,但异步函数暂停(我认为这是唯一的问题),因为如果你在同一个 window 它工作正常,但是当你切换到另一个 window 时,数组的下一个元素开始打印,并与前一个元素混合,这使得它看起来很奇怪,所以有没有解决方案?
JavaScript 来自上面链接的 CodePen:
// Numbers of skills stored in an array
let skillSet = ["DEVELOPER", "CODER", "BLOGGER", "PROGRAMMER", "WEB DEVELOPER", "DIGITAL MARKETER"];
// function to send each element from the given array
async function updateText() {
let i
skills.textContent = '';
for (i = 0; i<skillSet.length; i++) {
getText(skillSet[i]);
if (skillSet[i].length <= 5) {
await sleep(skillSet[i].length*420);
} else {
await sleep(skillSet[i].length*370);
}
if (i === skillSet.length-1) {
i = -1;
}
}
}
// function to get each charachter and add to the html
async function getText(string) {
for (let i = 0; i < string.length; i++) {
await sleep(70);
skills.textContent += string.charAt(i)
}
await sleep(700);
deleteText(string)
}
// function to delete each character(from last) from the html
async function deleteText(string) {
for (let i = string.length; i > 0; i--) {
await sleep(150);
skills.textContent = skills.textContent.slice(0, -1);
}
}
// function to pause the javascript, until the given task is done
function sleep(ms) {
return new Promise(resolve => setTimeout(() => resolve(), ms));
}
// calling the function
updateText();
浏览器暂停或显着减慢计时器和一些其他没有焦点的选项卡的后台处理。它因浏览器而异; Chrome 及其变体相当具有侵略性。
您的 sleep
函数依赖于 setTimeout
,因此它受到计时器 de-prioritized(或完全暂停)这一事实的影响。
基本上我创建了一个JavaScript项目
这里的问题是,当用户切换到另一个 window 时,for 循环继续工作,但异步函数暂停(我认为这是唯一的问题),因为如果你在同一个 window 它工作正常,但是当你切换到另一个 window 时,数组的下一个元素开始打印,并与前一个元素混合,这使得它看起来很奇怪,所以有没有解决方案?
JavaScript 来自上面链接的 CodePen:
// Numbers of skills stored in an array
let skillSet = ["DEVELOPER", "CODER", "BLOGGER", "PROGRAMMER", "WEB DEVELOPER", "DIGITAL MARKETER"];
// function to send each element from the given array
async function updateText() {
let i
skills.textContent = '';
for (i = 0; i<skillSet.length; i++) {
getText(skillSet[i]);
if (skillSet[i].length <= 5) {
await sleep(skillSet[i].length*420);
} else {
await sleep(skillSet[i].length*370);
}
if (i === skillSet.length-1) {
i = -1;
}
}
}
// function to get each charachter and add to the html
async function getText(string) {
for (let i = 0; i < string.length; i++) {
await sleep(70);
skills.textContent += string.charAt(i)
}
await sleep(700);
deleteText(string)
}
// function to delete each character(from last) from the html
async function deleteText(string) {
for (let i = string.length; i > 0; i--) {
await sleep(150);
skills.textContent = skills.textContent.slice(0, -1);
}
}
// function to pause the javascript, until the given task is done
function sleep(ms) {
return new Promise(resolve => setTimeout(() => resolve(), ms));
}
// calling the function
updateText();
浏览器暂停或显着减慢计时器和一些其他没有焦点的选项卡的后台处理。它因浏览器而异; Chrome 及其变体相当具有侵略性。
您的 sleep
函数依赖于 setTimeout
,因此它受到计时器 de-prioritized(或完全暂停)这一事实的影响。