Question

我正在尝试使用回调创建分层结果。

这是我的功能结构：

el('root', function(){

  el('users', function(){
    el('show');
  });

  el('products');

});

我想要的结果是：

assert.equal(result, [ 'root', 'root_users', 'root_users_show', 'root_products' ] );

我在实施过程中走得很远：http://jsfiddle.net/5ur5u/我遇到的问题是，每次调用el时我都会增加深度。它工作正常，直到它到达产品。因为show将深度放在3上意味着产品将在show结束时添加。

所以，如果有人能帮助我，或指出我正确的方向，那就太棒了。

Answer 1

你非常接近。你只需要在最后减少深度。见http://jsfiddle.net/Z2qsy/

而不是

depth += 1;
fn();

这样做

depth += 1;
fn();
depth -= 1;

Answer 2

由于el每次调用时都是相同的函数，因此无法区分在一个级别（show）或另一个级别（products）中调用它。 }）。你可以在每次调用el时增加级别，但是没有办法知道何时减少它，因为没有类似于在JavaScript中调用的“相反”。

稍微好一点的选择是将新函数传递给回调（您可以给它指定相同名称el），这是不同的，以便每个级别都有自己的el函数。这样，结果就可以正确构建：http://jsfiddle.net/5ur5u/2/。

var result = [];

function el(name, fn) {
    result.push(name); // add current name

    if(fn) { // if there is a function
        fn(function(name2, fn2) { // call the function with a new function
            el(name + "_" + name2, fn2); // which calls `el` recursively
                                         // with the names combined
        });
    }
}

el('root', function(el) {

  // this `el` refers to the function passed as declared above,
  // which is not the same one as the initial `el`
  el('users', function(el) {
    el('show');
  });

  el('products');

});

Answer 3

这就是你要求的

var names = [];
var result = [];

function el(name, f)
{
    names.push(name);
    result.push(names.join("_"));
    f && f();
    names.pop();
}

el("root", function(){
    el("users", function(){
        el("show")
    });
    el("products");
});

alert(result);

嵌套函数创建层次结构

3 个答案: