JavaScript 定時器無法正確清除：變量作用域導致重複啟動的解決方法

錯誤代碼

var timer = window.setInterval("getNewOrders()", 15000);
// ...
onclick: function (item, dialog) {
    var timer = window.setInterval("getNewOrders()", 15000); // 重新聲明局部變量
    dialog.close();
}

問題

處理函數內 var timer 宣告了**新的區域變數**，遮蔽外層全域 timer。導致：

1. 外層 timer 未被清除，原定時器持續運行。
2. 區域 timer 隨函數結束銷毀，無法後續 clearInterval。 3. 每次點擊「取消」都新增一個定時器，頻率倍增。

修正

let timer = window.setInterval(getNewOrders, 15000); // 使用函數引用而非字串

// 取消按鈕
onclick: function (item, dialog) {
    window.clearInterval(timer); // 清除全域定時器
    timer = window.setInterval(getNewOrders, 15000); // 重新賦值全域變數
    dialog.close();
}

最佳實踐

• 使用 let/const 替代 var，避免變量提升陷阱。
• setInterval 傳入函數引用（getNewOrders）而非字串，避免 eval 風險且效能更好。
• 單頁應用中，將定時器 ID 存儲於模組級變量或 Vue/React 組件實例屬性，統一管理生命週期。