Question

for (var i = 0; i < json.length; i++) {
    $.Mustache.load('/mustaches.php', function(i) {
         //Do Something
    });
}

在这种情况下如何将var i传递给函数？

编辑：对不起，我实际上并不想让Mustache.load调用太多次。只有一次。我怎么能这样做？

Answer 1

这比您想象的要复杂得多，因为您必须确保传递正确的i值，以便回调不使用循环结束的值。

for (var i = 0; i < json.length; i++) {
    (function(i){
        $.Mustache.load('/mustaches.php', function() {
            // use i. Call a function if necessary
            //Do Something
        });
    })(i);
}

关于回调术语：它指的是您作为参数传递的函数，以便您调用的函数可以将其调回。

要理解我写的代码，你必须

明白回调是在循环结束后调用的，所以当循环中的i具有循环结束的值时
非全局变量的范围是定义它的函数调用。这就是为什么有这个中间函数：定义另一个用循环值调用的变量i

Answer 2

解决问题的一种优雅方法是使用bind方法。

for (var i = 0; i < json.length; i++) {
    $.Mustache.load('/mustaches.php', function(i) {
         //Do Something
    }.bind(this, i));
}

bind方法返回一个带有新上下文的新函数（在本例中为this）并将一个（或多个）参数应用于您的函数（i特殊案例）。您可以找到有关bind和currying here。

的更多信息

EDIT。您只需加载模板一次即可优化循环。实际上，$.Mustache.load在循环的每个循环中都会获取/mustache.php。此外，由于函数使用AJAX异步获取模板，因此模板中的排序可能不一致（一个响应可能需要比其他响应更长的时间）。修复非常简单：我们加载模板，然后遍历循环。

$.get('/mustache.php').done(function(template){
  $.Mustache.add('my-template', template);
  for (var i = 0, len = json.length; i < len; ++i) {
    var rendered_template = $.Mustache.render('my-template', {
      i: i,
      ...
    });
  }
});

如何将变量传递给函数调用参数的一部分？

2 个答案: