Обещание бесконечного обратного вызова

Question

const foo = () => {
  console.log('ok')
  return Promise.resolve(1);
}

let bar = foo(); // line 1
bar.then(() => { // line 2
  bar = foo(); // line 3
})

Интересно, почему строка 3 не обновляет строку 2
, вызывая бесконечность
1. Обещание разрешения
2. Повторное создание bar обратно к1.

Если вы действительно хотите, чтобы он бесконечно циклировал, как указано выше, как бы вы изменили этот код без написания ада обратного вызова?

Answer 1

Вот как вы можете зацикливаться бесконечно. Чтобы не блокировать браузер полностью, я добавил setTimeout, поэтому обещание разрешается только примерно через полсекунды:

const foo = () => {
  console.log('ok');
  // Lets give the browser some air to breathe...
  return new Promise(resolve => 
      setTimeout(() => resolve(1), 500)
  );
}

const loop = async () => {
    while (true) await foo();
};

loop();

Без async await синтаксис:

const foo = () => {
  console.log('ok');
  // Lets give the browser some air to breathe...
  return new Promise(resolve => 
      setTimeout(() => resolve(1), 500)
  );
}

const loop = () => {
    foo().then(loop);
};

loop();

Answer 2

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

const foo = () => new Promise(resolve => {
  setTimeout(() => {
    console.log('ok');
    resolve()
  }, 1000)
})

const loop = (task) => {
  task().then(() => {
    loop(task)
  })
}

loop(foo)

Answer 3

const foo = () => {
  console.log('ok')
  return Promise.resolve(1);
}

let bar = foo(); // line 1
bar.then((val) => { // line 2
   bar = foo() // line 3
})

Сначала мы выполняем foo() здесь

let bar = foo(); // console.log('ok')

Затем вы делаете

bar.then((val) => { // after it
   bar = foo() // you again run this and get console.log('ok')
})

Тогда что?Никто не запускает его снова.

Хотите бесконечный цикл?

const foo = () => {
  console.log('ok')
  return Promise.resolve(1);
}

Promise.resolve().then(function resolver() {
    return foo()
    .then(() => console.log("ok"))
    .then(resolver);
})