突發奇想，在觸發事件的時候，一些會頻繁觸發的事件會不會造成資源的浪費或者大量的計算造成頁面卡頓，比如onresize,onscroll,onmousemove等事件。
然後就引出了乙個新知識點：防抖、截流。
防抖：是指在事件觸發結束後延時一段時間再去執行**，如果在延時期間再次觸發該事件，則重新計算延時時間。
例：瀏覽器觸發onresize事件的時候，需要重新計算頁面布局，在不防抖的情況下，不停的拖動瀏覽器視窗改變大小，瀏覽器就會不停的去計算，導致浪費大量的資源，加上防抖後，在觸發事件後延時600毫秒才判斷該事件結束，如果在600毫秒內再次觸發了該事件，則重新計算600毫秒，直到判斷事件結束之後才會觸發；
**如下：
//第乙個引數為事件觸發後需要執行的方法，第二個引數為延時時間function
debounce(method, delay)
timer = settimeout(function
() , delay);
}}let fun= debounce(() =>, 600);
window.addeventlistener('resize', fun);
截流：是指在規定時間內只觸發一次事件，減少事件執行的頻率；
例:實時判斷input框中的內容是否合法，正常情況下，我們給input 繫結乙個鍵盤彈起事件，彈起是時候去做判斷，如果使用者輸入過快，則會去做多次判斷。截流一秒的話就是指在一秒內不管使用者輸入多少次，都之後去判斷一次，既不會影響使用者體驗，有達到了節流的目的
**如下：
function throttle(func, wait)lasttime = now
} else if (!timeout) , wait)}}
}let quest = throttle(()=>,1000)
let btn = document.getelementsbytagname('button')[0];
btn.addeventlistener('click',quest)
使用方法和防抖相同
總結：一般情況下onresize，onkeyup事件使用防抖；onscroll、onmousemove等事件使用截流。
完工，睏告。
截流 和 防抖
截流防抖函式經常用在頻繁按鈕操作，頁面滾動觸發，滑鼠拖拽，輸入查詢等功能中。是為了在頻繁操作中為了減少效能損耗的小技巧,這兩個概念常用但是又容易混淆,下面簡單的分析下防抖與截流的異同之處 意味著防止抖動出現的誤操作，也就是防止像抖動一樣的頻繁操作。所以在防抖函式裡會有個時間限制，當函式在一次執行之後...
防抖與截流總結
防抖 是指在事件觸發結束後延時一段時間再去執行 如果在延時期間再次觸發該事件，則重新計算延時時間 第乙個引數為事件觸發後需要執行的方法，第二個引數為延時時間function debounce method,delay timer settimeout function delay let fun d...
函式截流和防抖
使用場景 有些時候，部分函式會高頻觸發，比如 function showtop window.onscroll showtop 這個函式的觸發頻率非常的高，然而實際上我們並不需要如此高頻的反饋，畢竟瀏覽器的效能是有限的，不應該浪費在這裡，優化這種場景的做法就是防抖。其他使用場景 頁面resize事件...