function ff() {
$('#s1').animate({left:'400px',top:'30px'});
}
function ff2() {
$('#s1').animate({left:'',top:''});
}
var ss = [3000,5000,6000,6000];
var yy = [8000,6000,3000,5000];
// var j=0;
for(var i=0;i<ss.length;i++){
setTimeout(function(){ff();},ss[i]);
// setTimeout(function(){ff();},ss[i]*i);
setTimeout(function(){ff2();},yy[i]);
console.log(ss[i]);
console.log(yy[i]);
}
從后端得到2個素組，希望按斬訓圈下標的陣列來延時執行相關代碼，現在問題是，延時的時間不準
?js回圈執行延時函式，哪位大咖幫幫原因
uj5u.com熱心網友回復：
準不準 要看設定延時器的時間 到 執行函式的時間 for回圈雖然執行速度很快，但是畢竟不是同步設定的;console.time()
console.timeEnd()
測驗一下
uj5u.com熱心網友回復：
每次結果不一樣啊？我加到這里對么？for(var i=0;i<ss.length;i++){
setTimeout(function(){ff();},ss[i]);
// setTimeout(function(){ff();},ss[i]*i);
setTimeout(function(){ff2();},yy[i]);
console.time()；
console.log(ss[i]);
console.timeEnd()；
}
default: 0.27294921875ms
uj5u.com熱心網友回復：
var i=0 改成 let i=0; var 沒有塊級作用域 你可以理解 回圈是同步 setTimeout 異步執行 回圈先走完 i值已經是最后變數的值了 才走異步uj5u.com熱心網友回復：
現在的誤差很小，是毫秒級的uj5u.com熱心網友回復：
還是說你想要的是在上次延時后累計的延時？uj5u.com熱心網友回復：
你應該是想累加延時吧，比如yy的8000毫秒輸出完再等6000毫秒輸出是吧，包裝成promise用then來控制，或者async函式，流程控制很多方法的uj5u.com熱心網友回復：
// 你的兩個函式
function ff() {
console.log('ff')
}
function ff2() {
console.log('ff2')
}
// 你的兩個陣列以及應該在第幾秒出現
const ss = [3000, 5000, 6000, 6000];
// [3,8,14,20]
const yy = [8000, 6000, 3000, 5000];
// [8,14,17,22]
// 把你的函式包裝成promise的函式
const bePromise = fn => timeout => new Promise(resolve => setTimeout(() => resolve(fn()), timeout))
// 先加入函式（柯里化）
ff = bePromise(ff)
ff2 = bePromise(ff2)
// ff函式的流程管理
async function foo() {
for(let i=0;i<ss.length;i++){
await ff(ss[i])
}
}
// ff2函式的流程管理
async function bar() {
for(let i=0;i<yy.length;i++){
await ff2(yy[i])
}
}
// 設定一個計時器看看實在第幾秒輸出的
let i=0
setInterval(() => {
i++
console.log(i)
}, 1000);
// 呼叫函式，開始輸出
foo()
bar()
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/13744.html
標籤：JavaScript