延迟函数调用
在当前调用栈清空后再调用函数。
- 使用
setTimeout()
函数,设置一个1毫秒的超时时间,将一个新的事件添加到事件队列中,让渲染引擎完成其工作。 - 使用扩展运算符(
...
)来传递任意数量的参数给函数。
const defer = (fn, ...args) => setTimeout(fn, 1, ...args);
// 示例 A:
defer(console.log, 'a'), console.log('b'); // 先输出 'b',再输出 'a'
// 示例 B:
document.querySelector('#someElement').innerHTML = 'Hello';
longRunningFunction();
// 直到这个函数执行完毕,浏览器才会更新HTML
defer(longRunningFunction);
// 浏览器会先更新HTML,然后执行函数