JavaScriptで見た目が同期的なsleepを書く方法を先日学んだのでメモします。
sleep.js
export function sleep (time) {
return new Promise(resolve => {
setTimeout(resolve, time)
})
}
使用
import { sleep } from './sleep'
const arr = [1, 2, 3, 4, 5]
async function doLoop () {
for (let i = 0; i < arr.length; i++) {
console.log(arr[i])
await sleep(3000)
}
}
doLoop()
関数 sleep は setTimeout で待つだけで何もしない Promise を返します。
関数を利用する側は async 関数の中で await しています。
結局 Promise を使っているので非同期なコードなのですが、async/awaitを使うことによって見た目がフラットになるので、普通に setTimeout だけで書くよりも見やすいコードになると思いました。