我的油门功能没有等待限制时间

Question

我正在学习节流，我遇到了一个问题，我的节流方法没有等待 limit 时间到运行。

const display = (msg) => {
    console.log(msg). // I know this function does not do anything, but I'm trying to understand how I can call a function inside my throttle.
}

const throttle = (func, limit) => {
    let flag = true;
    return function() {
        if(flag) {
            func.apply(this, arguments);
            flag = false;
            setTimeout(() => flag = true, limit);
        }
    }
}

const throttleDisplay = () => {
    return throttle(display("Hi"), 6000);
}

for(let i=1; i<=10; i++) {
    setTimeout(throttleDisplay, i*1000);
}

我的输出是“Hi”10 次，但我不应该有 10 次 Hi，因为我在一个呼叫和另一个呼叫之间有 6 秒的等待时间。

Answer 1

throttle 将回调作为参数，但您正在立即调用 display。

const throttleDisplay = () => {
    return throttle(display("Hi"), 6000);
}

完全等同于

const throttleDisplay = () => {
    const result = display("Hi");
    return throttle(result, 6000);
}

看到问题了吗？

您需要一个函数来调用 display 并使用您想要的参数：

const throttleDisplay = () => {
    return throttle(() => display("Hi"), 6000);
}

我的油门功能没有等待限制时间

My throttle function is not waiting the limit time

javascript

throttling