1

我想创建大约 10 个 XML HTTP 请求，如下所示。我想将 的值i用于第一个“子”引用，但由于i在执行回调之前发生更改，该值与i“结果”选项卡中获取的 url 不匹配。我如何概括这一点？

var i = 1;
WinJS.xhr({
    url: root.results[i].profile_image_url_https,
    responseType: 'blob'
}).done(function (result) {
    var imgTag = theDiv.children[1].children[0];
    var imageBlob = URL.createObjectURL(result.response, {
        oneTimeOnly: true
    });
    imgTag.src = imageBlob; //tempLocalUrl;
});

i = 2;

WinJS.xhr({
    url: root.results[i].profile_image_url_https,
    responseType: 'blob'
}).done(function (result) {
    var imgTag = theDiv.children[2].children[0];
    var imageBlob = URL.createObjectURL(result.response, {
        oneTimeOnly: true
    });
    imgTag.src = imageBlob; //tempLocalUrl;
});
4

5 回答 5

2

典型的方法是使用额外的函数（立即执行）来捕获循环变量的当前值，例如：

var i = 1;

WinJS.xhr({
    url: root.results[i].profile_image_url_https,
    responseType: 'blob'
}).done(function (inner_i) {
  // return the actual callback
  return function (result) {
    // use `inner_i` as needed
    var imgTag = theDiv.children[1].children[0];
    var imageBlob = URL.createObjectURL(result.response, {
      oneTimeOnly: true
    });
    imgTag.src = imageBlob; //tempLocalUrl;
  };
}(i)); // <= pass outer `i`
于 2012-11-30T10:27:00.257 回答
1

一般来说，你可以做两件事；

  1. 使用额外的功能
  2. 使用额外的变量

在参数对象{}中，WinJS.xhr没有将变量复制到的范围，所以我将使用选项 1：

var i = 1;
WinJS.xhr({
    url: root.results[ return function(i) { return i; }(i) ].profile_image_url_https,
    responseType: 'blob'
}).done(function (result) {
    var imgTag = theDiv.children[1].children[0];
    var imageBlob = URL.createObjectURL(result.response, {
        oneTimeOnly: true
    });
    imgTag.src = imageBlob; //tempLocalUrl;
});

i = 2;

WinJS.xhr({
    url: root.results[ return function(i) { return i; }(i) ].profile_image_url_https,
    responseType: 'blob'
}).done(function (result) {
    var imgTag = theDiv.children[2].children[0];
    var imageBlob = URL.createObjectURL(result.response, {
        oneTimeOnly: true
    });
    imgTag.src = imageBlob; //tempLocalUrl;
});

更新：额外变量：

var i = 1;
WinJS.xhr({
    copiedVar: i,
    url: root.results[ copiedVar ].profile_image_url_https,
    responseType: 'blob'
}).done(function (result) {
    var imgTag = theDiv.children[1].children[0];
    var imageBlob = URL.createObjectURL(result.response, {
        oneTimeOnly: true
    });
    imgTag.src = imageBlob; //tempLocalUrl;
});

i = 2;

WinJS.xhr({
    copiedVar: i,
    url: root.results[ copiedVar ].profile_image_url_https,
    responseType: 'blob'
}).done(function (result) {
    var imgTag = theDiv.children[2].children[0];
    var imageBlob = URL.createObjectURL(result.response, {
        oneTimeOnly: true
    });
    imgTag.src = imageBlob; //tempLocalUrl;
});
于 2012-11-30T10:20:43.760 回答
0

您可以在回调函数中增加 i 的值。这样，在使用之前它不会增加。

var i = 1;

WinJS.xhr({
    url: root.results[i].profile_image_url_https,
    responseType: 'blob'
}).done(function (result) {
    var imgTag = theDiv.children[1].children[0];
    var imageBlob = URL.createObjectURL(result.response, {
        oneTimeOnly: true
    });
    imgTag.src = imageBlob; //tempLocalUrl;

    i++;

});
于 2012-11-30T10:19:42.390 回答
0

在这种情况下，可能会增加回调中的值。但是解决这个范围问题的一种通用方法是使用 javascript 闭包。请查看http://jibbering.com/faq/notes/closures/

于 2012-11-30T10:27:27.950 回答
-1

这是一个很好的案例，我会考虑使用嵌套的连接承诺的方法：

var operations = [];
for(var i = 0; i < 10; i++) {
    operations.push(WinJS.join({
        myValue: i,
        xhr: WinJS.xhr({ url: "http://foo" }),
    }).then(function(data) {
       var yourValue = data.myValue;
       var xhrResponse = data.xhr;

       // Your processing you had before
    }));
 }

 WinJS.Promise.join(operations).done(function(operations) {
     // Done
 });

这使您有机会将事物隔离并包含在内。

于 2012-11-30T17:39:16.210 回答