JS 停顿1秒|极客笔记

JS 停顿1秒

在开发网页或应用程序时，有时我们需要在JS代码中加入一些延迟执行的操作。例如，可能需要等待一段时间后再执行某个函数，或者需要在用户点击某个按钮后等待一段时间再进行下一步操作。在这种情况下，我们可以使用JS中的定时器来实现延迟执行。

使用setTimeout实现延迟执行

在JS中，setTimeout函数可以用来在一定的时间后执行指定的函数。我们可以利用setTimeout函数来实现在JS中停顿1秒的效果。

示例代码如下：

console.log('开始执行');
setTimeout(function(){
    console.log('1秒后执行');
}, 1000);
console.log('继续执行');

在上面的代码中，首先会打印出”开始执行”，然后通过setTimeout函数指定在1000毫秒（即1秒）后执行一个匿名函数，该函数内会打印出”1秒后执行”。最后会继续打印出”继续执行”。可以看到，在1秒后才会打印出”1秒后执行”。

使用Promise实现停顿1秒

除了使用setTimeout函数外，我们还可以使用Promise对象来实现在JS中停顿1秒的效果。Promise对象是一种用于异步编程的原生对象，可以更加灵活地处理异步操作。

示例代码如下：

console.log('开始执行');
const pause = new Promise((resolve, reject) => {
    setTimeout(() => {
        console.log('1秒后执行');
        resolve();
    }, 1000);
});

pause.then(() => {
    console.log('继续执行');
});

在上述代码中，我们创建了一个Promise对象pause，通过setTimeout函数实现在1秒后打印出”1秒后执行”，然后调用resolve方法表示Promise执行成功。之后通过then方法指定在Promise执行成功后执行的操作，即打印出”继续执行”。同样可以实现在JS中停顿1秒的效果。

async/await实现停顿1秒

在ES6中引入的async/await语法糖可以让我们更加方便地处理异步操作。通过async函数和await关键字，可以让我们像同步代码一样编写异步代码，更加清晰易读。

示例代码如下：

console.log('开始执行');

const delay = async () => {
    await new Promise(resolve => setTimeout(resolve, 1000));
    console.log('1秒后执行');
    console.log('继续执行');
};

delay();

在上面的代码中，我们定义了一个async函数delay，并在其中使用await关键字等待一个Promise对象，在1秒后resolve该Promise。然后打印出”1秒后执行”和”继续执行”。通过async/await语法，可以更加清晰地实现在JS中停顿1秒的效果。