setTimeout和Promise
setTimeout和Promise
1. 执行顺序
首先我们来看这样一道题:
setTimeout(function() {
console.log(1); // 第六
}, 0);
new Promise(function(resolve, reject) {
console.log(2); // 第一
for (var i = 0; i < 10000; i++) {
if(i === 10) {
console.log(10); // 第二
}
i == 9999 && resolve();
}
console.log(3); // 第三
}).then(function() {
console.log(4); // 第五
})
console.log(5); // 第四 输出答案为 2 10 3 5 4 1
要先弄清楚 setTimeout(fun,0) 何时执行,promise 何时执行,then 何时执行。
setTimeout 这种异步操作的回调,只有主线程中没有执行任何同步代码的前提下,才会执行异步回调,而setTimeout(fun,0) 表示立刻执行,也就是用来改变任务的执行顺序,要求浏览器尽可能快的进行回调。
promise 何时执行,promise 新建后立即执行,所以 promise 构造函数里代码同步执行的,
then 方法指向的回调将在当前脚本所有同步任务执行完成后执行,那么 then 为什么比 setTimeout 执行的早呢,因为 setTimeout(fun,0) 不是真的立即执行,
经过测试得出结论:执行顺序为:同步执行的代码 —> promise.then —> setTimeout
2. 把setTimeout封装成promise
function timeout(delay){
let result = new Promise(resolve => setTimeout(resolve, delay));
return result;
}
timeout(2000).then(() => {
console.log("123");
return timeout(2000);
}).then(value => {
console.log("456");
}) JavaScript 文章被收录于专栏
前端技术分享
查看16道真题和解析