SOURCE

console 命令行工具 X clear

                    
>
console
function debounce(fn, wait, imme = false) {
    let timer
    return function () {
        let context = this
        let args = arguments
        if (timer) clearTimeout(timer)
        if (imme) {
            callNow = !timer
            timer = setTimeout(() => {
                timer = null
            }, wait)
            if (callNow) fn.apply(context, args)
        } else {
            timer = setTimeout(() => {
                fn.apply(context, args)
            }, wait)
        }
    }
}

function throttle(fn, wait, type = 1) {
    if (type === 1) {
        var timer = null
    } else {
        var prev = 0
    }
    return function () {
        let context = this
        let args = arguments
        if (type === 1) {
            //后执行
            if (!timer) {
                timer = setTimeout(() => {
                    timer = null
                    fn.apply(context, args)
                }, wait)
            }
        } else {
            //先执行
            let now = Date.now();
            if (now - prev > wait) {
                fn.apply(context, args);
                prev = now;
            }
        }

    }
}

let i = 0
let j = 0
const debounceDiv = document.querySelector('#debounceDiv')
debounceDiv.addEventListener('mousemove', debounce(function (ev) {
    this.innerHTML = i++
}, 1000, false))
const throttleDiv = document.querySelector('#throttleDiv')
throttleDiv.addEventListener('mousemove', throttle(function (ev) {
    this.innerHTML = j++
}, 1000, 1))
<div class="debounce text" id="debounceDiv"></div>
<div class="throttle text" id="throttleDiv"></div>
.debounce {
    width: 200px;
    height: 200px;
    background: red;
}

.throttle {
    margin-top: 20px;
    width: 200px;
    height: 200px;
    background: yellowgreen;
}

.text {
    text-align: center;
    color: #fff;
    font-size: 40px;
    line-height: 200px;
    font-weight: bolder;
}