節流 throttle（一段時間內只執行一次handle函式）

const div1 = document.getElementById('div1')

let timer = null
div1.addEventListener('drag',function (e) {
    if (timer){
        return
    }
    timer = setTimeout(() => {
        console.log(e.offsetX,e.offsetY)
        timer = null
    },100)
})

簡單的節流實現的邏輯

給div監聽拖拽事件，一開始timer為null，在100ms之內設定一個計時器賦值給timer，當到達100ms時觸發計時器，返回列印拖拽的實時座標，將null賦值給timer，之後繼續拖拽，再次建立一個新的計時器賦值給timer，在100ms內，拖拽是不間斷執行的，每隔100ms列印一次結果。

工具化寫法

function throttle(fn,delay = 100) {
    let timer = null

    return function () {
        if (timer) {
            return
        }
        timer = setTimeout(() => {
            fn.apply(this,arguments)
            timer = null
        },delay)
    }
}

div1.addEventListener('drag',throttle(function (e) {
    console.log(e.offsetX,e.offsetY)
},200))