如果存在 setTimeout，则输出顺序不同答案

【问题标题】：The output order is different if setTimeout is present如果存在 setTimeout，则输出顺序不同
【发布时间】：2019-02-22 01:20:35
【问题描述】：

使用递归函数将树结构返回到 console.log 的代码如下所示。我添加了setTimeout，因为我在代码处理过程中需要一些延迟，但是当我添加它时，处理顺序以完全不同的格式输出。此外，延迟时间似乎不是恒定的。

预期值为

如果搜索到第一个类别标题后节点中有child，则递归搜索第二个类别标题，再次查询children值，然后第三个.. ..如果加上setTimeout，则将首先播种整个种子，然后播种第二个完整种子，然后是第三个完整种子，以此类推。

为什么会这样？

            var time = 0;
            function searchTree(v, t){

                $(v).each(function(i,k){
                    setTimeout(function(){
                        if (t == 'clone'){
                            console.log(k.sCategoryTitle);
                            if (k.children){
                                searchTree(k.children,'clone');
                            }
                        }
                    }, time = time + 100);
                });
            }

示例代码：http://jsfiddle.net/uahg5qd9/3/

【问题讨论】：

更好地使用 for 循环，一旦找到匹配项，然后打破该循环，并调用递归函数。
setTimeout 是异步的。所以each 将循环遍历整个数组并设置一组超时，每个超时 100。

标签： javascript recursion settimeout

【解决方案1】：

你已经让你的函数同步了。

试试下面的代码，如果它对你有帮助的话。在这里我已经删除了循环并放置了另一个同步函数以使其同步。

var time = 100;
function searchTree(v, t){
    var i=0;
    function loop(){
        if(i<v.length){
            let k = v[i];    
            if (t == 'clone'){
                console.log(k.sCategoryTitle);
                if (k.children){
                    setTimeout(function(){
                        time = time + 100;
                        searchTree(k.children,'clone');
                    },time);
                }else{
                    i++;
                    loop();
                }
            }else{
                i++;
                loop();
            }
        }else{
            i++;
            loop();
        }
    }
    loop();
}

【讨论】：