Stel werk uit met setTimeout2() en clearTimeout2()

Total.js 5 · total5@0.0.19 timersdebounceutilities Uitgevoerd met Total.js 5

setTimeout2(id, callback, timeout) is setTimeout met een naam. Als je het opnieuw aanroept met hetzelfde id voordat de tijd om is, wordt de vorige timer geannuleerd en vervangen: de callback draait één keer, nadat de aanroepen ophouden. Het is de gebruikelijke manier om maar één keer op te slaan, te herladen of opnieuw te berekenen wanneer veel gebeurtenissen tegelijk binnenkomen (een reeks wijzigingen, typen, een stortvloed aan berichten).

clearTimeout2(id) annuleert de timer van dat id en geeft true terug als er een was en false als er geen was.

De volledige vorm is setTimeout2(id, callback, timeout, limit, a, b, c, d, e): de waarden na limit worden aan de callback doorgegeven. Gebruik limit niet in total5 0.0.19: het idee is de callback direct uit te voeren na limit vervangingen, maar de teller start nooit (hij is undefined en wordt NaN), dus de callback wordt pas aangeroepen als de tijd om is. Het voorbeeld roept hem tien keer aan met een limiet van 3 en de callback draaide niet te vroeg.

controllers/timers.js

exports.install = function() {
	ROUTE('GET /burst/', burst);
};

async function burst($) {

	const log = [];

	// three calls with the same id: only the last one runs
	setTimeout2('save', () => log.push('first'), 100);
	setTimeout2('save', () => log.push('second'), 100);
	setTimeout2('save', () => log.push('third'), 100);

	// a timer that is cancelled before it runs
	setTimeout2('gone', () => log.push('gone'), 100);
	const cancelled = clearTimeout2('gone');
	const nothing = clearTimeout2('never-set');

	// the values after the limit reach the callback
	setTimeout2('args', (a, b) => log.push(a + b), 50, 0, 'x', 'y');

	// the limit option does not run the callback early
	let early = 0;
	for (let i = 0; i < 10; i++)
		setTimeout2('limited', () => early++, 1000, 3);
	const stopped = clearTimeout2('limited');

	await new Promise(resolve => setTimeout(resolve, 300));
	$.json({ log: log, cancelled: cancelled, nothing: nothing, early: early, stopped: stopped });
}