Callbacks

Callbacks – это крутой объект. Он позволяет составлять списки функций обратного вызова, а также даёт бразды правления над ними. Работать с ним проще нежели с Deferred, в нём нет разделения на позитивный и негативный сценарии. Лишь стек функций, который будет выполнен по команде «.fire()»:

var C = $.Callbacks();

C.add(function(msg) {
    console.log(msg + " first")
});

C.add(function(msg) {
    console.log(msg + " second")
});

C.fire("Go");

Если открыть консоль и запустить скрипт выше, то в результате получите что-то типа такого:

>>>
Go first
Go second

— А в чём сила, брат?
— В аргументах.

По умолчанию вы можете прямо из консоли вызывать метод «.fire()» снова и снова, и будете получать один и тот же результат раз за разом. А можно задать поведение Callbacks через флаги:

once — все функции будут вызваны единожды (аналогично как в объекте Deferred).

memory — сохранять значение с последнего вызова «.fire()», и скармливать его в ново-зарегистрированные функции обратного вызова, и лишь потом обрабатывает новое значение (в Deferred именно так).

unique — список функций обратного вызова фильтруется по уникальности

stopOnFalse — как только какая-нибудь функция вернёт «false», процесс запуска остановится

Наверное, будет лучше с примерами, вот «once»:

var C = $.Callbacks("once");

C.add(function(msg) {
    console.log(msg + " first")
});

C.add(function(msg) {
    console.log(msg + " second")
});

C.fire("Go");

C.fire("Again"); // не даст результата, только Go

>>>
Go first
Go second

C «memory» посложнее, будьте внимательней:

var C = $.Callbacks("memory");

C.add(function(msg) {
    console.log(msg + " first")
});

C.fire("Go");

C.add(function(msg) {
  console.log(msg + " second")
});

C.fire("Again");

>>>
Go first
Go second // без флага, этой строчки не было бы
Again first
Again second

Пример с уникальностью прост до безобразия:

var C = $.Callbacks("unique");

var func = function(msg) {
    console.log(msg + " first")
};

C.add(func);
C.add(func); // эта строка не повлияет на результат

C.fire("Go"); // только Go first

>>>
Go first

Флаг «stopOnFalse»:

var C = $.Callbacks("stopOnFalse");

C.add(function(msg) {
    console.log(msg + " first");
    return false; // вот он – роковой false
});

C.add(function(msg) { 
    console.log(msg + " second"); 
});

C.fire("Go"); // только Go first

>>>
Go first

Перечисленные флаги можно комбинировать и получать интересные результаты, а можно не получать, а лишь посмотреть на следующий пример. Вот заготовка для работы:

// машинка
var $car = $('#car').show();
// наш стек команд
var C = $.Callbacks();

Добавьте команды по передвижению автомобиля в произвольном порядке и количестве. Для этого следует запустить перечисленные ниже скрипты (никаких изменений с машинкой до запуска метода «fire()» не будет):

C.add(function(speed) {
    $car.queue(function() { // поворот вниз, ставим в очередь с анимацией
        $(this).css("transform", "rotate(-90deg)").dequeue();
    });
    $car.animate({top:"+=800"}, speed); // едем вниз
});


C.add(function(speed) {
    $car.queue(function() { // поворот налево, ставим в очередь с анимацией
        $(this).css("transform", "rotate(0deg)").dequeue();
    });
    $car.animate({left:"-=400"}, speed); // едем влево
});


C.add(function(speed) {
    $car.queue(function() { // поворот вправо, ставим в очередь с анимацией
        $(this).css("transform", "rotate(180deg)").dequeue();
    });
    $car.animate({left:"+=400"}, speed); // едем вправо
});


C.add(function(speed) {
    $car.queue(function() { // поворот наверх ставим в очередь с анимацией
        $(this).css("transform", "rotate(90deg)").dequeue();
    });
    $car.animate({top:"-=400"}, speed); // едем вверх
});

Поехали!

// запускаем «программу»
// в качестве параметра передаём скорость движения
C.fire(400);

Из истории: объект «Deferred» отпочковался от метода «$.ajax()» в результате рефакторинга jQuery версии 1.5. Шло время, появлялись новые версии jQuery, и вот новый виток рефакторинга – результатом стало отделение «Callbacks» от «Deferred» в версии 1.7, таким образом в текущей версии библиотеки метод «$.ajax()» работает с объектом «Deferred», который является надстройкой над «Callbacks». Дабы не вносить путаницу в терминологию, я использую определение «Deferred Callbacks» и при работе с «Callbacks», ибо колбэков много, и каждый раз уточнять, что я говорю именно «о том самом» — дело достаточно утомительное.

Статьи по данной теме:

results matching ""

    No results matching ""