Как сделать обновление окна через некоторое время?

Question

[Semro]

Как при обновлении окна вызывать функцию через некоторое время?
Таким образом при обновлении окна функция вызывается несколько раз, что мне не нужно:

function onWindowResize() {
	setTimeout(function test(){wh(); draw();}, 250);
}

window.addEventListener( 'resize', onWindowResize, false );

Answer 1

[Евгений Петров]

Отменять отложенный вызов.

(function () {
	var resize;

	window.addEventListener('resize', function () {
		clearTimeout(resize);
		resize = setTimeout(function () {
			console.log('...');
		}, 250);
	}, false);
})();

Comments

[Semro]

В моём случае получилось вот так:

var resize;

function onWindowResize() {
	
	clearTimeout(resize);
	resize = setTimeout(function test(){wh(); draw();}, 100);
}

window.addEventListener( 'resize', onWindowResize, false );

[Евгений Петров]

Semro: Можно и так, только пара комментариев:

1. Именованная функция onWindowResize вряд ли используется где-то ещё. Нет великого смысла выносить её — можно в качестве обработчика указать безымянную функцию.
   
2. Не вижу вызова функции test в её теле. Смысл в имени пропадает.
   
3. Если вы используете свой код в глобальном контексте, лучше-таки завернуть в IIFE, чтобы не нарваться на возможные совпадения в именах. В этом случае функции wh и draw должны быть объявлены в контексте IIFE
   
4. Если код заключён в контексте вашей функции, то про IIFE можно пропустить.
   

Answer 2

[Константин Китманов]

Во многих библиотеках такое называется debounce, можно подсмотреть, как сделано в underscore/lodash.