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

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

编辑。您可以通过仅加载一次模板来优化循环。实际上，在循环的每个循环中都进行$.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,
      ...
    });
  }
});