一個糾結了很久的問題，有關于js防抖結合閉包的一個疑惑，求助-有解無憂

        // 防抖
        function calcTop (fn, delay) {
            let timer = null;
            console.log(timer);
            return function () {
                if (timer) {
                    clearTimeout(timer);
                }
                timer = setTimeout(fn, delay);
            }
        }

window.onscroll = calcTop(scrollTop, 1000);

為什么timer只執行一次呢？不是只要滾動就觸發防抖事假嗎？求助。。。

uj5u.com熱心網友回復：

滾動觸發 calcTop函式，calcTop中利用timer來保存 setTimeout回傳的參考。每次calcTop函式執行的時候，會先檢查timer是否存在，如果存在則把之前的imer，也就是定時器清除了（clearTimeout），所以 setTimeout 中的 fn 自然不會執行。

uj5u.com熱心網友回復：

參考 1 樓 foreverpx的回復:

滾動觸發 calcTop函式，calcTop中利用timer來保存 setTimeout回傳的參考。每次calcTop函式執行的時候，會先檢查timer是否存在，如果存在則把之前的imer，也就是定時器清除了（clearTimeout），所以 setTimeout 中的 fn 自然不會執行。

好的，謝謝。那console.log(timer)為什么只列印一次null呢，后面無論怎么滾都不再次列印了

uj5u.com熱心網友回復：

參考 2 樓十年半夏ぅ的回復:

Quote: 參考 1 樓 foreverpx的回復:
滾動觸發 calcTop函式，calcTop中利用timer來保存 setTimeout回傳的參考。每次calcTop函式執行的時候，會先檢查timer是否存在，如果存在則把之前的imer，也就是定時器清除了（clearTimeout），所以 setTimeout 中的 fn 自然不會執行。

好的，謝謝。那console.log(timer)為什么只列印一次null呢，后面無論怎么滾都不再次列印了

因為calcTop函式回傳的是一個function，這個function被賦值給了onscroll，滾動的時候執行的是這個function，而不是calcTop。

uj5u.com熱心網友回復：

參考 5 樓 foreverpx的回復:

Quote: 參考 2 樓十年半夏ぅ的回復:
Quote: 參考 1 樓 foreverpx的回復:
滾動觸發 calcTop函式，calcTop中利用timer來保存 setTimeout回傳的參考。每次calcTop函式執行的時候，會先檢查timer是否存在，如果存在則把之前的imer，也就是定時器清除了（clearTimeout），所以 setTimeout 中的 fn 自然不會執行。

好的，謝謝。那console.log(timer)為什么只列印一次null呢，后面無論怎么滾都不再次列印了

因為calcTop函式回傳的是一個function，這個function被賦值給了onscroll，滾動的時候執行的是這個function，而不是calcTop。

好的，謝謝大佬耐心的解答

轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/27113.html

標籤：JavaScript

上一篇：大神幫幫忙用SQL和VS完成注冊模塊和登錄模塊

下一篇：微信小程式視頻不能播放