作为网络工作者 returns 结果异步将数据推入数组

Question

我开发了通过创建 5 个网络工作者来执行操作的代码。我只是将整数发送给网络工作者以生成总和和 return 一个 json 对象。我将该结果推入一个数组。一旦所有网络工作者完成他们的任务，这个数组就会存储在本地存储中。问题是存储在本地存储中的数组不会按照每个 Web Worker 编辑的 return 顺序存储值。如果 web worker return 首先编辑了值，那么数组必须在零索引处包含它的值，这意味着不满足异步操作。我该怎么做？

这是我的 .js 文件代码：

      window.onload = init;
   var running = 0;
    var arr=[1,1001,2001,3001,4001];
   var sec=[1000,2000,3000,4000,5000]
   var results=[];
    function init() {

      sendworker();
    }


   function sendworker()
    {

     var n, worker;
     display("Starting workers...");

     for (n = 0; n <5; ++n) {
    workers = new Worker("jsonWorker.js");
    workers.onmessage = workerDone;
    workers.postMessage({id: n, start: arr[n],end:sec[n]});
    ++running;

     }

}

  function workerDone(e) {
    --running;
    display("Worker  " + e.data.id + " is done, sum of integers between: "+e.data.start+ "&"+e.data.end+"=" + e.data.sum);
    results.push(e.data.sum);

    if (running === 0) { // <== There is no race condition here, see below
        display("All workers complete");
        window.localStorage.setItem("Results", JSON.stringify(results));

    }
}

function display(msg) {
    var p = document.createElement('p');
    p.innerHTML = String(msg);
    document.body.appendChild(p);
}

// 我的网页代码 worker.js

 this.onmessage = function(e) {
  var data = e.data;
  var a=data.start;
  var b=data.end;
  var c=0;
  for (var i=a; i<= b; i++) {

     c=c+i;

  }
  this.postMessage({id: e.data.id,start:a,end:b,sum: c});

};

在图片 worker 0 中，return首先得到结果，因此它的数据应该在存储在本地存储中的数组的第二个索引上，但事实并非如此。

Answer 1

使用它们的 id 作为偏移量（以在它们开始后对结果进行排序）：

results[e.data.id] = e.data.sum;

Answer 2

您可以使用 await Promise.all([someCall(), anotherCall()])。您将以正确的顺序获得结果。（如果您正在转译您的代码）

作为网络工作者 returns 结果异步将数据推入数组

async pushing data into array as web worker returns result

javascript

arrays

web-worker