即时通讯试图做类似谷歌文档。这是一个自动保存的系统/循环。闲置几秒钟后，我将保存一个文档（通过从类中调用save方法）。
如果在那几秒钟内有活动，那么我将计时器重置/延长几秒钟。该循环将一直持续到调用save方法为止，其中，我将中断循环并等待其他活动再次启动循环。
这是我想出的一些伪代码：
doc.on('mouse:up', (event) => {
... //<--- Initialize the timer on mouse:up event
... //<--- When time is up, execute the save method
})
doc.on('mouse:down', (event) => {
... //<--- prolong timer initialized in the mouse:up event if it is available.
}
但是，我认为这种方式是不可能的，因为我无法访问相同的初始化setTimeOut对象。是否有实现此目的的好方法？很想听听你们的消息。
有几种方法可以解决此问题。
方法：基本
缺点：低级，行为不是立即显而易见的。
const saveDelayMs = 1000;
let timeoutId;
doc.on('mouse:up', (event) => {
timeoutId = setTimeout(save, saveDelayMs);
});
doc.on('mouse:down', (event) => {
clearTimeout(timeoutId);
timeoutId = setTimeout(save, saveDelayMs);
}
方法：消除抽象
优点：更高级别，代码更易读
// Trigger 1000ms after last call
const debouncedSave = debounce(save, 1000);
doc.on('mouse:up', (event) => {
debouncedSave();
});
doc.on('mouse:down', (event) => {
debouncedSave();
});
function debounce(fn, debounceDelayMs) {
let timeoutId;
return () => {
clearTimeout(timeoutId);
timeoutId = setTimeout(fn, debounceDelayMs);
};
});
Lodash提供了一个反跳功能，建议您创建自己的一个功能。
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句