SOURCE

let debButton = document.querySelector("#debounce")
let debounce = function(fn,wait=500){
    let timeOut;
    return function(){
        const args = arguments;
        if(timeOut){
            clearTimeout(timeOut)
        }
        console.log(arguments[0])
        timeOut = setTimeout(()=>{
            fn.apply(this,args)
        },wait)
    }
    
}
let debFn = function(val){
    
    console.log(`防抖----${val}---`)
}

let deb = debounce(debFn,1000)
// debButton.addEventListener('click',()=>{
//     deb(1)
// })
debButton.onclick = function(){
    deb(1)
}

let thrButton = document.querySelector("#throttle");
let throttle = function(fn,wait=500){
    let timeOut;
    return function(){
        if(!timeOut){
            const args = arguments;
            timeOut = setTimeout(()=>{
                fn.apply(this,args)
                timeOut = null;
            },wait)
        }
    }

}
// var throttle = function(func, delay){
//     var timer = null;
//     return function(){
//         var context = this;
//         var args = arguments;
//         if(!timer){
//             timer = setTimeout(function(){
//                 func.apply(context, args);
//                 timer = null;
//             },delay);
//         }
//     }
// }
let thrFn = function(val){
    console.log(`节流---${val}---`)
}
let thr = throttle(thrFn,1000)
thrButton.onclick = function(){
    thr(2)
}

<button id="debounce">防抖按钮</button>
<button id="throttle">节流按钮</button>