JavaScript 實現Sleep方法（多個setTimeout同步執行）

前言

JavaScript是單線程的，如果所有操作都是同步，必將線程堵塞，頁面失去響應。因此JavaScript采用了事件驅動機制，在單線程模型下，使用異步回調函數的方式來實現非阻塞的IO操作。因此也就出現了多個setTimeout存在時，不能達到理想的效果。那么在JavaScript中實現其他語言中Sleep的效果呢？

解決辦法

首先借助Promise對setTimeout函數進行改良，實現一個返回Promise的Sleep函數。

function Sleep (time) {
  return new Promise((resolve) => setTimeout(resolve, time));
}
// 用法
Sleep(5000).then(() => {
    //Do some thing
})

這里用到了ES6中的箭頭(arrow)函數，但是這里不是同步的，我們需要借助 async/await 關鍵字。

//引用JQuery
$(async function() {
  console.log('Do some thing, ' + new Date());
  await Sleep(5000);
  console.log('Do some thing, ' + new Date());
});

function Sleep (time) {
  return new Promise((resolve) => setTimeout(resolve, time));
}

借助 async/await 關鍵字，我們就實現了類似於其他語言中的Sleep函數。