javascript回调没有将数据推送到调用的顶部

Question

我正在慢慢学习如何使用回调，但遇到了麻烦。我认为下面的代码应该可以工作，但事实并非如此。

据我所知，它并没有下降到递归函数，就像它遇到另一个“树”条目或最后输出任何东西一样。

我遇到的其中一个问题是 for 循环中的回调。我不确定是否有更好的方法来做到这一点:我只是使用一个计数器来查看我是否在调用回调之前处于循环的末尾。

非常感谢一些指导。

(function () {
    'use strict';

    var objectsList = [];

    function makeAJAXCall(hash, cb) {
        $.ajaxSetup({
            accept: 'application/vnd.github.raw',
            dataType: 'jsonp'
        });

        $.ajax({
            url: hash,
            success: function (json) {

                if (cb) {
                    cb(json);
                }
            },
            error: function (error) {
                console.error(error);
                throw error;
            }
        });
    }

    function parseBlob(hash, cb) {
        makeAJAXCall(hash, function (returnedJSON) {  // no loop as only one entry
            if (cb) {
                cb(returnedJSON.data);
            }
        });
    }

    function complete(cb, loopLength, treeContents) {
        concole.info(loopLength);
        if (cb && loopLength === 0) {
            objectsList.push(treeContents);
            cb();
        }
    }

    function parseTree(hash, treeName, cb) {
        var treeContents = {'tree': treeName, 'blobs': []}, loopLength, i, entry;
        var tree = 'https://api.github.com/repos/myusername/SVG-Shapes/git/trees/' + hash;
        makeAJAXCall(tree, function (returnedJSON) {
            loopLength = returnedJSON.data.tree.length;
            for (i = 0;  i < returnedJSON.data.tree.length; i += 1) {
                entry = returnedJSON.data.tree[i];
                if (entry.type === 'blob') {
                    if (entry.path.slice(-4) === '.svg') {     // we only want the svg images not the ignore file and README etc
                        parseBlob(entry.url, function (json) {
                            treeContents.blobs.push(json.content);
                            loopLength -= 1;
                            complete(hash, loopLength, cb);
                        });
                    }
                } else if (entry.type === 'tree') {
                    parseTree(entry.sha, entry.path, function () {console.info(objectsList);});
                }
            }
        });
    }

    $(document).ready(function () {
        parseTree('master', 'master', function () {     // master to start at the top and work our way down
            console.info(objectsList);
        });
    });
}());

Answer 1

您的递归将无法正常工作，因为您收集 blob 数据的变量 treeContents 是递归函数的局部变量，因此在每次调用 parseTree() 时都会创建新的并销毁。它不会累积数据。您必须在 parseTree() 函数的范围之外创建此变量，以便此变量的单个实例可以从一次调用到下一次调用，并且您可以在其中正确地累积数据。

有几种方法可以解决这个问题:

1. 您可以将 treeContents 的当前状态传递给 parseTree() 函数
2. 您可以使函数的递归部分成为共享公共(public) treeContents 变量的局部函数。
3. 您可以将 treeContents 变量设为全局变量。

第二个是我在这里的选择:

function parseTree(topHash, topTreeName, topCb) {
    var treeContents = {'tree': toptreeName, 'blobs': []};

    function parse(hash, treeName, cb) {
        var loopLength, i, entry;
        var tree = 'https://api.github.com/repos/myusername/SVG-Shapes/git/trees/' + hash;
        makeAJAXCall(tree, function (returnedJSON) {
            loopLength = returnedJSON.data.tree.length;
            for (i = 0;  i < returnedJSON.data.tree.length; i += 1) {
                entry = returnedJSON.data.tree[i];
                if (entry.type === 'blob') {
                    if (entry.path.slice(-4) === '.svg') {     // we only want the svg images not the ignore file and README etc
                        parseBlob(entry.url, function (json) {
                            treeContents.blobs.push(json.content);
                            loopLength -= 1;
                            complete(hash, loopLength, cb);
                        });
                    }
                } else if (entry.type === 'tree') {
                    parse(entry.sha, entry.path, function () {console.info(objectsList);});
                }
            }
        });
    }

    parse(topHash, topTreeName, topCb);
}

假设 ajax 调用是异步的，您仍然需要找到一种方法来知道何时完成所有解析并调用将 treeContents 数据传递给的函数，否则，该数据不可用于任何其他功能。由于 ajax 调用的异步性质，它不能简单地从 parseTree 返回。