<input type="submit" id="btn" value="提交">
<script>
    var btn = document.getElementById('btn');
    // 点击后触发debounce()函数，第一个参数为真实要执行的函数，第二个参数为定时器延迟时间
    btn.addEventListener('click',debounce(submit,1000));
    //真实要执行的函数
    function submit(e){
        console.log("提交成功！");
        console.log(this)
        console.log(e);
    }
    //防抖函数
    function debounce(fn,delay){
        //设置time为定时器
        var time = null;
        //闭包原理，返回一个函数
        return function (e){
            //如果定时器存在则清空定时器
            if(time){
                clearTimeout(time);
            }
            //设置定时器，规定时间后执行真实要执行的函数
            time = setTimeout(() => {//此箭头函数里的this指向btn这个按钮
                fn.call(this,arguments);//改变真实要执行函数的this指向，原submit函数里面的this指向window
            },delay);
        }
    }
</script>

<input type="submit" id="btn" value="提交">
<script>
    var btn = document.getElementById('btn');
    // 点击后触发debounce()函数，第一个参数为真实要执行的函数，第二个参数为定时器延迟时间
    btn.addEventListener('click',throttle(submit,500));
    //真实要执行的函数
    function submit(e){
        console.log("提交成功！");
        console.log(this)
        // console.log(e);
    }
    //节流函数
    function throttle(fn,delay){
        //bef为上一次执行时间，初始值为0
        var bef = 0;
        return function (e){
            //获取当前时间戳
            var now = new Date().getTime();
            //如果当前时间减去上次时间大于限制时间时才执行
            if(now - bef > delay){
                console.log(this);
                fn.call(this,arguments);
                bef = now;
            }
        }
    }
</script>