Многократный вызов JS-функции с разными обратными вызовами каждый раз выполняет только последний обратный вызов

#javascript #jquery

Вопрос:

У меня есть функция, которую я вызываю несколько раз, передавая ей другую функцию обратного вызова в качестве аргумента. Мне нужно выполнить переданный обратный вызов при вызове функции, однако он всегда выполняет последний обратный вызов столько раз, сколько вызывается функция.

Вот пример:

 var loadCallback = 'undefined';
function callMe (callback) {
    loadCallback = callback;
    // some code here

    loadCallback();
}

Затем я вызываю его 3 раза следующим образом:

 callMe(function(){
    var test1 = function () {console.log('test1')}
    test1();

    // another code that has to be executed, but only the one from the last call is executed every time
});

callMe(function(){
    var test2 = function () {console.log('test2')}
    test2();

    // another code that has to be executed, but only the one from the last call is executed every time
});

callMe(function(){
    var test3 = function () {console.log('test3')}
    test3();

    // another code that has to be executed, but only the one from the last call is executed every time
});

Во фрагменте SO:

Показать фрагмент кода

 var loadCallback;

function callMe(callback) {
  loadCallback = callback;
  loadCallback();
}

callMe(function() {
  var test1 = function() {
    console.log('test1')
  }
  test1();
});

callMe(function() {
  var test2 = function() {
    console.log('test2')
  }
  test2();
});

callMe(function() {
  var test3 = function() {
    console.log('test3')
  }
  test3();
});

И в консоли я вижу:

 test3
test3
test3

вместо:

 test1
test2
test3

Почему это происходит и как это исправить? Я ищу в Google уже более часа и не могу найти решение.

1. Затем я вызываю его 3 раза вот так — там только один вызов — как вы вызываете его три раза? 3 раза подряд? или 3 раза в цикле? или настройка, а затем вызов? Кажется, что ваше «вызовите его 3 раза подобным образом» вызывает его только с жестко test1 закодированным текстом, поэтому неясно, откуда взялся test2 / test3.

2. Я отредактировал вопрос. Я вызываю его 3 раза из разных частей кода.

3. Спасибо за редактирование. Очень важно, как вы его вызываете. Я поместил ваш код, как вы указали, что вы его вызываете, во фрагмент в вопросе, и вы увидите, что он работает абсолютно нормально. Возможно, вы могли бы обновить фрагмент, чтобы показать код, который вы используете, там, где он не работает?

4. Вот версия, работающая в цикле: jsfiddle.net/tmLpj7a1 Поскольку loadCallback вызывается немедленно, он не использует глобальный loadCallback (учитывая предоставленный код) после его настройки и не страдает от проблем с закрытием.

5. Да, это так. Я нашел свою ошибку и исправил ее. Спасибо за комментарий.

Ответ №1:

Проблема в том, что вы объявляете loadCallback вне функции. Таким образом, вы перезаписываете это назначение на каждой итерации вашего цикла.

Чтобы исправить это, просто используйте callback аргумент напрямую. Также обратите внимание, что вам не нужно переносить функцию обратного вызова несколько раз при ее определении. Попробуйте это:

 function callMe(callback) {
  // other logic...
  callback();
}

for (var i = 1; i <= 3; i  ) {
  callMe(function() {
    console.log('test'   i)
  });
}

1. Ваш код работает, однако, когда я использую callback аргумент напрямую, я получаю сообщение об ошибке (3 раза) TypeError: callback is not a function . Однако console.log('Callback: ' typeof callback); в начале функции указано, что это функция, но выше, где я ее вызываю, указано, что она не определена. Я в замешательстве.

2. Я допустил огромную ошибку в другом коде функции. Я вызываю его рекурсивно и не передал аргумент обратного вызова, поэтому он не определен. Теперь это работает, и я принимаю этот ответ.