2-11 防抖节流原理、区别以及应用，请用js实现。

防抖：
原理：触发事件后，逻辑延迟执行，如果在一定时间内再次触发，就清除上一次的定时，重新计时
区别：与节流的区别在与，如果一直持续不间断的触发事件，那么逻辑将永远都不会执行
应用：按钮的点击

function event() {
    console.log('事件触发')
}

function debounce(fn, delay) {
    let timeId = null;
    return function(...args) {
        clearTimeout(timeId)
        timeId = setTimeout(function(){
            //事件逻辑
            fn(...args)
        }, delay)
    }
}

onClick='debounce(event, 1000)'

节流：
原理：持续的触发事件，给定一定的事件间隔，只会触发一次。两次事件触发的时间间隔必须大于指定但时间，否则无法触发
区别：与防抖的区别在与，事件的触发是间断性的，在一段时间内，能触发多次
应用：模糊查询

function event() {
    console.log('事件触发')
}

function throttle(fn, delay) {
    let start = Date.now()
    return function(...args) {
        let end = Date.now()
        if (end - start < delay) {
            return
        }
        fn(...args);
        start = end;
    }
}

onClick='throttle(event, 1000)'