Как вызвать следующий interval после смены флага?

Question

[devfior]

Есть setInterval функция, выполняющая определенное действие каждые 5 секунд:
setInterval(() => this.switchNextTab(), 5000);
Есть флаг isLoading который сменяется в true, если загружается запрос.
Ориентируясь на переменную isLoading, как вызвать следующий колбэк в setInterval, когда isLoading станет false?

Comments

[v3shin]

Используйте setTimeout и контролируйте его вызовы как хотите.

[Сергей Соколов]

надо, наверное, что-то делать в том месте, где устанавливается значение переменной isLoading.

Просто установка переменной — дело тихое, бесшумное, незаметное. Его нельзя «слушать», и как только изменится – сделать что-то ещё (включить следующий таб).

Можно этот флаг поместить внутрь какого-нибудь объекта, в котором определить сеттер для этого свойства — функцию, которая будет выполняться каждый раз при установке нового значения someObj.isLoading = false; Тогда из этой же функции можно выполнять и другую бизнес-логику.

Answer 1

[Сергей Соколов]

Можно «подглядывать» за изменениями свойства объекта.
Предлагаю не переменную isLoading, а свойство некого объекта изменять: flags.isLoading = false;

const PERIOD = 5000;
let timeout;

const action = () => {
  console.log('Action!');
  // this.switchNextTab()
  clearTimeout(timeout);
  timeout = setTimeout(action, PERIOD);
};

const flags = {
  _isLoading: false,

  set isLoading(value) {
    this._isLoading = value;
    if (!value) {
      // isLoading стал false
      action();
    }
  },

  get isLoading() {
    return this._isLoading;
  },
};

timeout = setTimeout(action, PERIOD);

// где-то в коде:
flags.isLoading = true;
// ...
flags.isLoading = false; // тут же выполнится action

Answer 2

[zkrvndm]

Асинхронность вам поможет. Пример выполнения чего-либо каждые 1000 мс. пока истинно условие:

let uslovie = true;

(async () => {
    
    while (uslovie) {
        
        console.log('Тыц');
        
        await new Promise(s => setTimeout(s, 1000));
        
    }
    
})();