Javascript 是否可以创建一个油门功能,将另一个功能(也有参数)和延时作为参数
因此,我已经编写了一个函数,该函数(基于下划线throttle)适用于不接受参数的函数,但我想使其足够通用,以便传入一个参数数量可变的函数。以下是我所拥有的:Javascript 是否可以创建一个油门功能,将另一个功能(也有参数)和延时作为参数,javascript,closures,throttling,Javascript,Closures,Throttling,因此,我已经编写了一个函数,该函数(基于下划线throttle)适用于不接受参数的函数,但我想使其足够通用,以便传入一个参数数量可变的函数。以下是我所拥有的: (function () { var lastTime = new Date().getTime(); function foo() { var newTime = new Date().getTime(); var gap = newTime - lastTime; // Tr
(function () {
var lastTime = new Date().getTime();
function foo() {
var newTime = new Date().getTime();
var gap = newTime - lastTime; // Travels up scope chain to use parents lastTime. Function has access to variables declared in the same scope
console.log('foo called, gap:' + gap);
lastTime = newTime; // Updates lastTime
//console.log(x);
//x++;
}
var throttle = function(func, wait) {
var result;
var timeout = null; // flag updated through closure
var previous = 0; // time last run updated through closure
return function() { //func, wait, timeout, previous available through scope
var now = new Date().getTime();
var remaining = wait - (now - previous);
if (remaining <= 0) {
clearTimeout(timeout);
timeout = null;
previous = now;
result = func.apply(this, arguments); //func is available through closure
}
return result;
};
};
document.addEventListener("scroll", throttle(foo, 1000));
//document.addEventListener("scroll", throttle(foo(5), 2000));
}());
(函数(){
var lastTime=new Date().getTime();
函数foo(){
var newTime=newdate().getTime();
var gap=newTime-lastTime;//向上移动作用域链以使用父lastTime。函数可以访问在同一作用域中声明的变量
log('foo调用,gap:'+gap);
lastTime=newTime;//更新lastTime
//控制台日志(x);
//x++;
}
var节流阀=功能(func,等待){
var结果;
var timeout=null;//通过闭包更新标志
var previous=0;//通过闭包更新的上次运行时间
return function(){//func,wait,timeout,previous可通过作用域使用
var now=new Date().getTime();
var剩余=等待-(现在-以前);
如果(剩余的节流阀(foo(5),2000)
将不起作用,因为当您使用括号调用函数时,您正在调用该函数
将foo
传递给throttle时,需要将其包装在匿名函数中
throttle(function(){
foo(5)
}, 2000)
如果要跟踪x
的原始值,请将foo包装到函数中,并返回foo。将值捕获到闭包范围中
function foo(x) {
return function(){
var newTime = new Date().getTime();
var gap = newTime - lastTime; // Travels up scope chain to use parents lastTime. Function has access to variables declared in the same scope
console.log('foo called, gap:' + gap);
lastTime = newTime; // Updates lastTime
console.log(x);
x++;
}
}
然后您实际上可以告诉我们throttle(foo(5),2000)
,因为它不会在第一次调用时执行预期的功能
示例:(固定示例)
采用任意数量参数的解决方案可修改油门:
function throttle(func, wait, args){
//do throttle stuff
func.apply(null, args);
}
然后
throttle(foo(5),2000)
变成throttle(foo,2000,[5])
你不容易确定两者之间的区别。区别在于throttling foo()和throttling foo(x)这并不能真正描述您正在寻找的行为。是否要保留x的初始值?是否每次都要使用不同的x。更不用说您发布了大量代码,并进行了非常细微的更改。如果不是addEventListener行,我不会猜到您想要什么。但这仍然是一个猜测。foo(x)应该像任何其他javascript函数一样运行…请记住节流是为了什么…我有一个调用很多的函数…我希望它不会被调用太多…第一个调用是立即调用的,第二个调用只是在传入的某个时间段之后,第三个调用也只是在某个时间段之后,等等。现在我不想改变w我的函数可以工作…我希望它在节流之前的工作方式与在节流实现之后的工作方式相同。节流的目的当然是在再次调用函数之前放弃线程并让其他事情发生。我尝试过包装foo(x)在传入之前,在一个匿名函数中,这不起作用,但我将使用foo包装器检查您的示例,看看它是否起作用,然后我将其标记为已回答…@StanQuinn您感觉如何?谢谢您的回答!throttle(foo,2000,[5])
按预期工作,但Lodash文档没有反映这一点。。。
function throttle(func, wait, args){
//do throttle stuff
func.apply(null, args);
}