JavaScript油门常归功能
JavaScript Throttle always returning function
我正在尝试了解 JavaScript 节流。我根据目前所掌握的知识实现了一个非常基本的节流阀。
const display = (msg) => {
return msg;
}
const throttleDisplay = (func, limit) => {
let flag = true;
return function() {
if(flag) {
func.apply(this, arguments);
flag = false;
setTimeout(() => flag = true, limit);
}
}
}
for(let i=1; i<=5; i++) {
setTimeout(() => {
const result = throttleDisplay(display("Hi"), 6000);
console.log(result)
}, i*1000);
}
我的 console.log 正在返回 [Function]
而不是消息 Hi
。此外,它返回 [Function]
5 次。在超过 6000 毫秒的限制之前,它不应该忽略下一次调用吗?
非常感谢!
节流方式不同。
首先,您应该将节流函数命名为 throttle
,因为它没有与 display
明确关联。然后,您应该调用此 throttle
以获得 是 特定于 display
的函数。只有这样,您才能在实际用例中使用该辅助功能,即使用计时器。
这里是你的代码更正:
const throttle = (func, limit) => {
let flag = true;
return function() {
if(flag) {
func.apply(this, arguments);
flag = false;
setTimeout(() => flag = true, limit);
}
}
};
const throttleDisplay = throttle(() => console.log("Hi"), 6000);
for(let i=1; i<=10; i++) {
setTimeout(throttleDisplay, i*1000);
}
我正在尝试了解 JavaScript 节流。我根据目前所掌握的知识实现了一个非常基本的节流阀。
const display = (msg) => {
return msg;
}
const throttleDisplay = (func, limit) => {
let flag = true;
return function() {
if(flag) {
func.apply(this, arguments);
flag = false;
setTimeout(() => flag = true, limit);
}
}
}
for(let i=1; i<=5; i++) {
setTimeout(() => {
const result = throttleDisplay(display("Hi"), 6000);
console.log(result)
}, i*1000);
}
我的 console.log 正在返回 [Function]
而不是消息 Hi
。此外,它返回 [Function]
5 次。在超过 6000 毫秒的限制之前,它不应该忽略下一次调用吗?
非常感谢!
节流方式不同。
首先,您应该将节流函数命名为 throttle
,因为它没有与 display
明确关联。然后,您应该调用此 throttle
以获得 是 特定于 display
的函数。只有这样,您才能在实际用例中使用该辅助功能,即使用计时器。
这里是你的代码更正:
const throttle = (func, limit) => {
let flag = true;
return function() {
if(flag) {
func.apply(this, arguments);
flag = false;
setTimeout(() => flag = true, limit);
}
}
};
const throttleDisplay = throttle(() => console.log("Hi"), 6000);
for(let i=1; i<=10; i++) {
setTimeout(throttleDisplay, i*1000);
}