JS 等待1秒

JS 等待1秒

在前端开发中，有时候我们需要在执行一个任务之后等待一定的时间再继续执行下一个任务。这种情况下，我们可以使用 JavaScript 中的 setTimeout 函数来实现等待的效果。

setTimeout 函数

setTimeout 函数是 JavaScript 中的一个全局函数，用来在指定的时间之后执行一个指定的函数或者一段代码。其语法如下：

setTimeout(function, delay);

其中，function 是要执行的函数或者代码块，delay 是等待的时间，单位为毫秒。

等待1秒的示例

下面是一个简单的示例，演示了如何等待1秒后在控制台输出一句话：

console.log('开始执行');
setTimeout(() => {
    console.log('等待1秒后输出');
}, 1000);
console.log('继续执行');

上面的代码首先会输出 开始执行，然后等待1秒后输出 等待1秒后输出，最后输出 继续执行。这是因为 setTimeout 函数会将要执行的代码放入事件队列中，在指定的时间后执行，不会阻塞后续代码的执行。

运行结果

开始执行
继续执行
等待1秒后输出

让函数等待1秒

有时候我们需要等待1秒后再执行一个函数，可以将该函数作为参数传递给 setTimeout 函数。下面是一个示例：

function sayHello() {
    console.log('Hello, world!');
}

console.log('开始执行');
setTimeout(sayHello, 1000);
console.log('继续执行');

上面的代码中，sayHello 函数会在等待1秒后输出 Hello, world!。运行结果如下：

开始执行
继续执行
Hello, world!

使用 Promise 封装

如果希望更加灵活地等待1秒后执行某个操作，可以使用 Promise 来封装 setTimeout。下面是一个封装的示例：

function waitOneSecond() {
    return new Promise((resolve) => {
        setTimeout(() => {
            resolve();
        }, 1000);
    });
}

console.log('开始执行');
waitOneSecond().then(() => {
    console.log('等待1秒后输出');
});
console.log('继续执行');

上面的代码中，waitOneSecond 函数返回一个 Promise 对象，在等待1秒后将状态改为 resolved，然后执行后续的操作。运行结果如下：

开始执行
继续执行
等待1秒后输出

总结

在 JavaScript 中，我们可以使用 setTimeout 函数来实现等待1秒的效果。通过控制等待的时间和要执行的函数或代码块，可以很方便地实现等待的功能。同时，结合 Promise 可以更加灵活地控制等待的时间和后续的操作。