递归承诺

Question

我查看了一些关于 Promise 中递归的问题，但对如何正确实现它们感到困惑：

• Recursive Promise in javascript
• AngularJS, promise with recursive function
• Chaining Promises recursively
• Javascript Recursive Promise

我整理了一个简单的示例（见下文） - 这只是一个示例，因此我可以了解如何使用 Promise 进行递归，而不是我正在工作的代码的表示。

Net-net，我希望承诺解决，但根据节点上的输出，它没有解决。对如何解决这个问题有任何见解吗？

var i = 0;

var countToTen = function() { 
    return new Promise(function(resolve, reject) {
        if (i < 10) {
            i++;
            console.log("i is now: " + i);
            return countToTen();
        }
        else {
            resolve(i);
        }
    });
}

countToTen().then(console.log("i ended up at: " + i));

以及控制台上的输出：

> countToTen().then(console.log("i ended up at: " + i));
i is now: 1
i is now: 2
i is now: 3
i is now: 4
i is now: 5
i is now: 6
i is now: 7
i is now: 8
i is now: 9
i is now: 10
i ended up at: 10
Promise { <pending> }

承诺永远不会解决。

Answer 1

如果您查看您的代码，只要i 小于 10，您就是在递归并且永远不会解决承诺。你最终解决了一个承诺。但这不是最初的调用者得到的承诺。

您需要使用递归返回的承诺来解决。如果您使用 promise 进行解析，系统将如何工作，直到值也被解析后才会解析：

let i = 0;
const countToTen = () => new Promise((resolve, reject) => {
    if (i < 10) {
      i++;
      console.log("i is now: " + i);
      resolve(countToTen());
    } else {
      resolve(i);
    }
  });

countToTen().then(() => console.log("i ended up at: " + i));

最后一部分也有错误。你没有为then 提供函数，所以如果你做了一些实际上会等待的事情，你会首先得到"i ended up at: 0"。

Answer 2

如果你将i作为函数的参数而不是依赖外部状态会更好

const countToTen = (i = 0) =>
  new Promise ((resolve, _) =>
    i < 10
      ? (console.log (i), resolve (countToTen (i + 1)))
      : resolve (i))
      
      
countToTen () .then (console.log, console.error)
// 0 1 2 3 4 5 6 7 8 9 10

如果你也将10 设为参数会更好

const countTo = (to, from = 0) =>
  new Promise ((resolve, _) =>
    from < to
      ? (console.log (from), resolve (countTo (to, from + 1)))
      : resolve (from))

countTo (7, 2) .then (console.log, console.error)
// 2 3 4 5 6 7

更通用的方法是 reverse 折叠 - 或 unfold

const unfold = (f, init) =>
  f ( (x, acc) => [ x, ...unfold (f, acc) ]
    , () => []
    , init
    )

const countTo = (to, from = 0) =>
  unfold
    ( (next, done, acc) =>
        acc <= to
          ? next (acc, acc + 1)
          : done ()
    , from
    )

console.log (countTo (10))
// [ 0, 1, 2, 3, 4, 5, 6,  7, 8, 9, 10 ]

console.log (countTo (7, 2))
// [ 2, 3, 4, 5, 6, 7 ]

但你想要一个异步展开，asyncUnfold。现在用户提供的函数 f 可以是异步的，我们得到所有收集值的 Promise

const asyncUnfold = async (f, init) =>
  f ( async (x, acc) => [ x, ...await asyncUnfold (f, acc) ]
    , async () => []
    , init
    )

const delay = (x, ms = 50) =>
  new Promise (r => setTimeout (r, ms, x))

const countTo = (to, from = 0) =>
  asyncUnfold
    ( async (next, done, acc) =>
        acc <= to
          ? next (await delay (acc), await delay (acc + 1))
          : done ()
    , from
    )

countTo (10) .then (console.log, console.error)
// [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ]

countTo (7, 2) .then (console.log, console.error)
// [ 2, 3, 4, 5, 6, 7 ]

这是一个更实际的例子，我们有一个记录数据库，我们希望执行递归查找或其他操作......

• db.getChildren 接受节点 id 并仅返回节点的立即子节点

• traverse 接受节点 id 并递归获取所有后代子节点（深度优先顺序）

const data =
  { 0 : [ 1, 2, 3 ]
  , 1 : [ 11, 12, 13 ]
  , 2 : [ 21, 22, 23 ]
  , 3 : [ 31, 32, 33 ]
  , 11 : [ 111, 112, 113 ]
  , 33 : [ 333 ]
  , 333 : [ 3333 ]
  }

const db =
  { getChildren : (id) =>
      delay (data [id] || [])
  }

const Empty =
  Symbol ()

const traverse = (id) =>
  asyncUnfold
    ( async (next, done, [ id = Empty, ...rest ]) =>
        id === Empty
          ? done ()
          : next (id, [ ...await db.getChildren (id), ...rest ])
    , [ id ]
    )

traverse (0) .then (console.log, console.error)
// [ 0, 1, 11, 111, 112, 113, 12, 13, 2, 21, 22, 23, 3, 31, 32, 33, 333, 3333 ]

Answer 3

尽量不要在你的函数中使用共享的可变状态（尤其是当它们是异步的时候）。您正在使用 window.i 但任何东西都可以更改该值，这不是必需的，因为 i 值仅在您的函数中用作计数器：

const later = (milliseconds,value) =>
  new Promise(
    resolve=>
      setTimeout(
        ()=>resolve(value),
        milliseconds
      )
  );

const countTo = toWhat => {
  const recur = counter =>
    later(1000,counter)
    .then(
      i=>{
        console.log(`i is now: ${i}`);
        return (i<toWhat)
          ? recur(i+1)
          : i;
      }
    )
  return recur(1);
}

countTo(10)
.then(
  i=>console.log(`i ended up at: ${i}`)
);

Answer 4

很多成员已经提到，需要用递归返回的promise来解决。

我想将代码共享为async/await 语法。

const printNumber = (i) => console.log("i is now: " + i);

// recursive function to call number increment order
const recursiveCallNumber = async (i, checkCondition) => {
    // if false return it, other wise continue to next step
    if (!checkCondition(i)) return;
    // then print
    printNumber(i); 
     // then call again for print next number
    recursiveCallNumber(++i, checkCondition);
}

await recursiveCallNumber(1, (i) => i <= 10);