2018.01.14

モダンJavaScriptで同期っぽいsleep

JavaScript

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 だけで書くよりも見やすいコードになると思いました。

JavaScript