极客笔记JS 5秒时候执行
在前端开发中，经常会遇到需要在页面加载完成后延迟一段时间执行某个操作的情况。比如需要在页面加载后5秒钟之后弹出一个提示框，或者在页面加载完成后5秒后自动播放视频等。
在本文中，我们将详细探讨如何使用JavaScript来实现在页面加载完成后延迟5秒钟执行指定操作的方法。我们将分为以下几个部分来进行讨论：
- 使用setTimeout函数实现延迟执行
- 使用async/await结合setTimeout实现延迟执行
- 使用Promise对象封装延迟执行的操作
- 总结和实际应用场景
使用setTimeout函数实现延迟执行
setTimeout函数是JavaScript中的一个定时器函数，用来在指定的时间间隔后执行指定的代码。我们可以利用setTimeout函数来实现在页面加载完成后5秒钟延迟执行指定操作的效果。
// 延迟5秒钟执行操作
setTimeout(function(){
console.log('5秒钟后执行的操作');
}, 5000);
上面的代码中，通过setTimeout函数指定了一个5秒钟后执行的操作，当页面加载完成后5秒钟后会输出”5秒钟后执行的操作”的信息。
使用async/await结合setTimeout实现延迟执行
在ES6中，引入了async/await语法，使得异步操作更加直观和方便。我们可以结合async/await和setTimeout来实现在页面加载完成后5秒钟延迟执行操作。
async function delayedExecution(){
await new Promise(resolve => setTimeout(resolve, 5000));
console.log('5秒钟后执行的操作');
}
delayedExecution();
上面的代码中，我们定义了一个async函数delayedExecution，内部结合了await和setTimeout，实现了在页面加载完成后5秒钟延迟执行指定操作的效果。
使用Promise对象封装延迟执行的操作
除了使用setTimeout和async/await结合setTimeout来实现延迟执行外，我们还可以通过Promise对象来封装延迟执行的操作。
function delayedExecution(){
return new Promise(resolve => {
setTimeout(() => {
console.log('5秒钟后执行的操作');
resolve();
}, 5000);
});
}
delayedExecution();
上面的代码中，我们定义了一个delayedExecution函数，内部通过Promise对象封装了延迟5秒钟执行的操作，并在5秒钟后执行指定操作。
总结和实际应用场景
在实际的项目开发中，我们经常会遇到需要延迟执行某个操作的情况，比如需要在页面加载完成后一段时间后执行相关逻辑、加载远程数据等。