神奇的递归:Javascript递归代替for循环 解决循环调用异步操作时数据顺序错乱

如下图,在用for循环执行一个异步方法时,会发现,无论该方法有没有执行完,循环都会直接开始第二次循环,如果对数据的顺序有要求的话,那么就会发现输出的顺序是错乱的,因为每次异步方法的执行时间都是波动的,猜测跟系统分配的线程有关。所以会输出如下图的错乱顺序。

提示:之所以用setTimeout方法也是去模拟一个异步操作,用随机的时间来模拟异步方法的执行时间的波动性。

因此遇到这种情况,就必须换一种写法了,用递归的方法,也就是方法调用自己本身来实现循环的效果,同时能够保证每次都能按顺序输出数据,如下图,可以发现使用递归方法后输出就是按顺序的了。其实看起来非常简单明了,就是程序调用自身。如果i等于循环次数后就不再调用自身,从而来停止。这种方法很好地解决了在循环中放入异步操作会出现不执行完异步操作就执行第二次循环导致输出顺序不对的情况。

  • 5
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
使用递归解决树形结构数据循环调用问题的关键是要踪已经访问过的节点,以免进入无限循环。下是一个示例,演示了如何使用递归解决树形结构数据循环调用问题: ```javascript // 树节点类 class TreeNode { constructor(value) { this.value = value; this.children = []; } addChild(childNode) { this.children.push(childNode); } } // 递归遍历树 function traverseTree(node, visitedNodes = new Set()) { // 如果节点已经被访问过,则直接返回 if (visitedNodes.has(node)) { return; } // 访问当前节点 console.log(node.value); visitedNodes.add(node); // 遍历子节点 for (const child of node.children) { traverseTree(child, visitedNodes); } } // 创建树形结构数据 const root = new TreeNode('A'); const nodeB = new TreeNode('B'); const nodeC = new TreeNode('C'); const nodeD = new TreeNode('D'); const nodeE = new TreeNode('E'); root.addChild(nodeB); root.addChild(nodeC); nodeB.addChild(nodeD); nodeD.addChild(nodeE); // 循环调用测试 nodeE.addChild(root); // 在 E 节点中添加对根节点的引用 // 使用递归遍历树 const visitedNodes = new Set(); traverseTree(root, visitedNodes); ``` 在这个示例中,我们定义了一个 `TreeNode` 类表示树的节点,每个节点都有一个值属性 `value` 和一个子节点数组 `children`。我们使用 `addChild` 方法添加子节点。 `traverseTree` 函数用于递归遍历树,并通过一个 `Set` 数据结构来记录已经访问过的节点,以防止无限循环。在访问节点,我们打印节点的值,并将节点添加到已访问节点集合中。 在创建树形结构数据后,我们对节点 `E` 执行了一个循环调用测试,将根节点 `A` 作为子节点添加到了 `E` 节点。在使用递归遍历树,我们传入一个空的已访问节点集合,并在遍历过程中传递该集合,确保只访问未被访问过的节点,避免了无限循环。 请注意,以上示例仅提供了一个基本的使用递归解决树形结构数据循环调用问题的思路。在实际应用中,可能需要根据具体情况进行适当的调整和优化。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值