jQuery метод .notifyWith()

jQuery объект Deferred

Определение и применение

jQuery метод .notifyWith() запускает событие прогресса выполнения с определенными аргументами и контекстом выполнения, которое позволяет вызвать обработчики состояния объекта Deffered, находящегося на стадии выполнения (deferred.progress() и deferred.then()).

Когда метод .notifyWith() вызывается, любые добавленные объектом Deffered функции прогресса выполнения (progressCallbacks) вызываются. Обратные вызовы выполняются в порядке их добавления. Каждому обратному вызову могут передоваться дополнительные аргументы от метода .notifyWith().

Любые вызовы метода .notifyWith(), добавленные после того как объект Deffered переходит в состояние resolved (успешное выполнение), или rejected (выполнение отклонено) будут игнорированы.


Обычно этот метод должен вызываться только создателем объекта Deffered, вы можете запретить другому коду изменять состояние объекта, возвращая ограниченный объект Promise с использованием метода deferred.promise().


Если у Вас отсутствует необходимость указывать определенный контекст исполнения, то вы можете воспользоваться методом deferred.notify().

jQuery синтаксис:

Синтаксис 1.7:

deferred.notifyWith( context )
deferred.notifyWith( context, args )

context - Object
args - Array

Добавлен в версии jQuery

1.7

Значения параметров

ПараметрОписание
contextКонтекст (объект this), который передается функциям обратного вызова (функциям прогресса выполнения progressCallbacks - deferred.progress() и deferred.then()).
argsНеобязательные аргументы, которые передаются в виде массива функциям обратного вызова (функциям прогресса выполнения progressCallbacks - deferred.progress() и deferred.then()).

Пример использования

<!DOCTYPE html>
<html>
	<head>
		<title>Использование jQuery метода .notifyWith()</title>
		<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
		<script>
	$( document ).ready(function() {
	  let dfd = $.Deferred(); // создаем объект Deferred
 
	  dfd.progress(function( p ){ // добавляем обработчик, вызываемый когда объект Deffered создает уведомления о ходе выполнения
	    $( "meter" ).attr( "value", p ); // устанавливаем значение атрибута value
	    $( "span" ).html( p ); // задаем содержимое элемента значением переменной
	  })
	  .done(function(){ // добавляем обработчик, который будет вызван при изменении состояния объекта Deffered на resolved
	    $( "p" ).html( "операция завершена" );  // задаем содержимое элемента текстовой информацией
	  });
		  
	  $( ".start" ).click(function() { // задаем функцию при нажатиии на элемент с классом .start
	    for (let i = 10; i <= 100; i = i + 10) {  // увеличиваем i до 100 с шагом 10
	      setTimeout( () => { // выполняем функцию после определенной задержки
	        dfd.notifyWith( this, [i] ); // запускаем событие прогресса выполнения с текущим контекстом
	        if ( i == 100 ) { // если i равно 100
	          dfd.resolve(); // изменяем состояние объекта Deffered на resolved
	        }
	      }, i * 50); // устанавливаем задержку в 500 миллисекунд
	    }	
	  });
	});
		</script>
	</head>
	<body>
		<button class = "start">Старт</button>
		<meter value = "0" min = "0" max = "100" low = "40" high = "70" optimum = "90"></meter><span></span>
		<p></p>
	</body>
</html>

В этом примере мы инициализируем переменную, которая содержит объект Deffered, созданный с помощью фабричной функции $.Deferred(). С помощью метода .progress() добавляем обработчик, вызываемый когда объект Deffered создает уведомления о ходе выполнения. Когда это происходит мы с помощью метода .attr() устанавливаем новое значение атрибуту value элемента <meter> значением, полученным от метода .notifyWith(). Обратите внимание, что в качестве контекста мы передаем методу .notifyWith() текущий контекст (this), это аналогично вызову метода .notify( i ). Кроме того, мы с помощью метода .html() помещаем это значение в качестве содержимого элемента <span>.

При нажатии на элемент <button>, благодаря установленному обработчику событий "click" на элементе мы запускаем цикл, который увеличивает значение переменной i до 100 с шагом 10. Внутри цикла с помощью метода setTimeout мы выполняем функцию после определенной задержки, которая с помощью метода .notify() запускает событие прогресса выполнения, и в качестве аргумента использует текущее значение переменной цикла.

При достижении переменной значения равному 100 мы с помощью метода .resolve() изменяем состояние объекта Deffered на resolved (успешное выполнение). Обратите внимание, что у нас на объекте Deffered с помощью метода .done() установлен обработчик, который будет вызван при изменении состояния объекта Deffered на resolved и с помощью метода .html() задаст содержимое элемента текстовой информацией.

Результат нашего примера:

Пример использования jQuery метода .progress() и .notify().
Пример использования jQuery метода .progress() и .notify().
jQuery объект Deferred