一文詳解 Linux 系統常用監控工具(top,htop,iotop,iftop)
阿新 • • 發佈:2021-06-25
首先先了解概念:
防抖和節流:限制當前函式的執行次數
節流和防抖都是在降低頻率
防抖: 通過setTimeout 的方式,在一定時間間隔內,將多次觸發變成一次觸發。
舉個列子:
一個按鈕,每點選一次會打印出1,使用者不斷地點選,就會不斷的去發起請求,這會很浪費資源,可以防抖進行優化。
<body> <button id="submit">提交</button> <script> var sub = document.getElementById('submit') var timer=null sub.onclick=function(){ clearTimeout(timer) //作用是在下一次點選開始前,把上一個定時器關閉,保證最後只保證一個 timer = setTimeout(()=>{ console.log("傳送請求") },1000) } </script> </body>
上面的程式碼就是防抖的程式碼列子,防抖在規定時間內,只會執行一次操作,應用場景可以是搜尋欄中的提示、滾動條的滾動等。
節流: 規定一個判斷,改變這個判斷即可,這個判斷叫做節流閥,同時也是用setTimeout
<body> <button id="submit">提交</button> <script> var sub = document.getElementById('submit') var flage = true sub.onclick = function() { if (flage) { flage = false console.log(1); setTimeout(() => { flage = true }, 1000) } } </script> </body>
這裡的flage就是節流閥,用flage去判斷
節流用的場景可以是商品預覽圖的放大鏡效果時,不必每次滑鼠移動都計算位置
防抖和節流的區別
防抖:不用在意過程,在一段時間內,只有最後一次產生效果
節流:一段時間內可以產生多個效果,只不過是降低了頻率
擴充套件
防抖和節流不想寫的時候可以引用 Lodash.js
防抖的用法
節流的用法
原型和原型鏈的簡單瞭解
原型和原型鏈本來可以不做記錄,但是怕我忘記,簡單的記錄一下
先從對應的名字開始。
原型:propotype
原型鏈:
_proto_
從屬關係。
prototype 從屬與函式,是函式的屬性,每一個函式都有預設的prototype(原型屬性) 普通物件 {}
proto 物件的一個屬性 object: 也是一個物件{}
每一個物件的_proto_儲存著該物件的建構函式prototype
?.constructor->實列化?物件的建構函式
繼承方式可以用原型鏈繼承