Web Worker函數無法解析數組，返回單個結果

我第一次使用Web Workers，並且需要一些幫助使我的函數可以正常工作。Web Worker函數無法解析數組，返回單個結果

這是我的代碼：

var myWorker = new Worker('./js/worker.js'); 

... 

for(i = 0; i < passaggi.length; i++) { 
    lat = passaggi[i].lat; 
    lon = passaggi[i].lon; 
    timestamp = passaggi[i].timestamp; 



    myWorker.postMessage([lat, lon]); 
    myWorker.onmessage = function(e) { 

     console.log('Message received from worker'); 
     nome = e.data 
     tmp = "<table border='1'><tr><td>" + i + "</td><td>" + nome + "</td><td>" + timestamp + "</td></tr></table>"; 
     tabella.innerHTML += tmp; 


    } 
}

Passaggi是陣列;我希望工作人員使用Google地理編碼API解析數組中每個項目的'lat'和'lon'，並返回城鎮的名稱。

當主函數收到消息時，會添加一個包含名稱和時間戳的表。 Tabella是將包含它的div。

問題是，該函數會創建正確數量的表，但每個表都包含passaggi中最後一個元素的數據！輸出示例：

| 4 | Rome | 2015-09-14 23:44:38 | 
| 4 | Rome | 2015-09-14 23:44:38 | 
| 4 | Rome | 2015-09-14 23:44:38 | 
| 4 | Rome | 2015-09-14 23:44:38 |

這是worker.js的內容，但代碼似乎是罰款：

onmessage = function(data){ 

     var mapAPI = "http://maps.googleapis.com/maps/api/geocode/json?latlng=" + data.data[0] + "," + data.data[1] + "&sensor=true"; 


     var req = new XMLHttpRequest(); 
     req.open('GET', mapAPI, true); 
     req.onreadystatechange = function (aEvt) { 
      if (req.readyState == 4){ 
       if(req.status == 200){ 
        result = JSON.parse(req.responseText); 
        console.log(result); 
        message = result.results[0].address_components[2].long_name; 
        postMessage(message); 
       } 
      else 
       console.log("Error loading page\n"); 

      } 
     } 
    req.send(null); 
}

據我瞭解，Web Workers是一種用於執行後臺功能，而不會阻塞有用頁面的其餘部分;解析座標似乎是一個很好的應用程序，爲此。我究竟做錯了什麼？

在此先感謝您的幫助。

來源

2015-09-15 Ferduun

有何幫助他們的職能而不是全球性的？ – Thilo

另外，你不能在回調中使用循環計數器'i'。在回調被調用的時候，循環已經結束了，'i'將會超過最後一次迭代（或者完全不同的東西）。 – Thilo

您的VAR i是引用這意味着將有循環的最後一個值，你應該使用一個IIFE：如果你正確地聲明所有的變量，因此，他們是本地的

(function(i) { 
    myWorker.onmessage = function(e) { 

    console.log('Message received from worker'); 
    nome = e.data 
    tmp = "<table border='1'><tr><td>" + i + "</td><td>" + nome + "</td><td>" + timestamp + "</td></tr></table>"; 
    tabella.innerHTML += tmp; 


}})(i);

來源

2015-09-15 00:17:25 taxicala

還需要爲'timestamp'做這件事。 – Thilo

也應用了時間戳的建議，並做出了正確的聲明，現在我的值是3而不是4，但是否則結果相同。猜猜這意味着它現在停在正確的週期？（i = 3，顯示4個元素） – Ferduun

Web Worker函數無法解析數組，返回單個結果

回答

相關問題