手写防抖、节流

防抖

监听一个输入框，文字变化后触发change事件
直接用keyup事件，则会频繁触发change事件
防抖：用户输入结束或暂停时，才会触发change事件
防止表单多次提交

/**
 * 防抖
 */
function debounce(fn, delay) {
    let timer = null
    return function () {
        if (timer) {
            clearTimeout(tiemr)
        }
        timer = setTimeout(()=>{
            fn.apply(this, arguments)
            timer = null
        }, delay);
    }
}

节流

拖拽一个元素时，要随时拿到该元素被拖拽的位置
直接用drag事件，则会频繁触发，很容易导致卡顿
节流：无论拖拽速度多块，都会每隔100ms触发一次

/**
 * 节流
 */
function throttle(fn, delay = 100) {
    let timer = null
    return function(){
        if (tiemr) {
            return
        }
        thimer = setTimeout(() => {
            fn.apply(this, arguments)
            timer = null
        }, delay);
    }
}