setTimeout

• 定時器，只執行一次，屬於非同步
• 語法：

setTimeout(()=> function,delay)

• function | string：時間到後想要執行的函式內容
• delay：單位為毫秒(1 秒 = 1000 毫秒)，若不寫預設為 0，直接執行

console.log(1);

setTimeout(() => console.log(4), 3000)
// 在 3000 毫秒(3秒) 後執行

setTimeout(() => console.log(3), 0)
// 在 0秒 後執行 = 直接執行，但會排在原本的程式碼之後

console.log(2);
//非同步執行，不管幾秒，先執行 1 2 後才會是 3、4

// 1 > 2 > 3 > 4

• 可以透過 clearTimeout取消程式碼的執行。

let timeoutid = setTimeout(( () => console.log("timeout") ), 5000);

clearTimeout(timeoutid);

// 傳入非 function
setTimeout(console.log("Hello!"), 1000);

// （馬上印出） Hello!

// 實際上是 ＝
setTimeout("undefined", 1000);
// function 沒有回傳值，那就是 undefined
// 會馬上印出 Hello! 是因為程式進行到 console.log("Hello!") 所以被直接執行

// 使用字串的部分會在 1秒之後執行
// (內部隱含 eval 的轉換，所以執行上效能會比非字串的版本差一些。)

setTimeout('console.log("Hello!")', 1000);

// （1秒之後） Hello!

setInterval

• 定時器，會不斷重複執行，屬於非同步
• ex: 每秒更新的時鐘
• 語法：

setInterval(()=> function, delay)

• function：想要重複執行的函式內容

• delay：單位為毫秒(1 秒 = 1000 毫秒)，若值 < 10，則設定為 10

參考

JavaScript Day22 - setTimeout、setInterval
JS 原力覺醒 Day26 - 常用 API： setTimeout / setTimeInterval

更多之間的差別比較與應用：
使用setInterval與setTimeout需要注意的部分