防抖函数怎么取消防抖？

Question

防抖函数怎么取消防抖？
这个取消防抖啥意思，就是比如点击按钮取消防抖，那就是立即输出的意思吗？

function debounce(func, wait, immediate) {
    var timer;
    // 检查函数
    if (typeof func !== 'function') {
        throw new TypeError('Expected a function');
    }
    // 保证wait存在
    wait = +wait || 0;

    const debounced = function () {
        var _this = this;
        var args = arguments;

        if (timer) clearTimeout(timer); // 常规流程，间隔内触发时清掉重置定时
        if (immediate) {
            // 如果已经执行过，不再执行
            var callNow = !timer; // 如果不存在定时器，则callNow为true
            timer = setTimeout(function () {
                timer = null; // 为了保证之后的时效性，手动添加timer
            }, wait)
            // 因为不存在timer，证明是首次执行，所以直接调用
            if (callNow) func.apply(_this, args)
        }
        else {
            timer = setTimeout(function () {
                func.apply(_this, args)
            }, wait);
        }
    }

    const cancel = function(){
        clearTimeout(timer);
        timer = null;
    }

    const pending = function(){
        return timer !== undefined;
    }

    debounced.cancel = cancel;
    debounced.pending = pending;
    return debounced
}

Answer 1

防抖是美女先用婚约吊着舔狗的胃口，如果婚约到期还没有新的人来舔，美女就会嫁给眼前人，如果有新人来就毫不犹豫取消原定的婚约，另立新约。
这里的取消就是取消当前的婚约，取消之后这个美女也就不知所踪，就像很多有头无尾的故事的主角一样。
但是历史总会重演，新的美女将与新的舔狗在新的时空里重生。

Answer 2

直接调用原函数就可以了。

Answer 3

这 “取消” 的方法不是在这儿写着的么，就是直接清理了定时器，直接不会执行目标函数了。

const cancel = function(){
    clearTimeout(timer);
    timer = null;
}

Answer 4

借用 lodash 当中的 防抖函数来说吧，它提供了一个 cancel 和 flush 两个方法。

一般来说就可以在需要取消下一次执行的时候使用 cancel 方法，如果需要立即执行就可以调用 flush 方法。
比如说很多时候都会给长表单增加自动保存的功能，用户在持续输入中就会推迟自动保存功能的执行（防抖）。但在表单提交的时候就会去执行 cancel 方法来取消下一次自动保存，因为数据已经提交了不需要再执行了。以及在表单关闭的时候立刻执行一次自动保存功能，所以就需要使用 flush 方法来立即执行一次自动保存，因为需要立即保存一下当前数据然后再关闭弹窗保证数据会被收集到。

文档：lodash.debounce | Lodash 中文文档
源码：lodash/debounce.js at master · lodash/lodash