javascript - HTML5 Web Workers - 如何在线程之间共享工作

Question

我对 JS 很陌生，但在研究了 Web Worker API 之后，我对一些基本的多线程有所了解。我在下面的尝试是抽象用于确定下一个工作单元的逻辑，即 sendWorkUnit()，然后在启动工作人员和消息处理程序期间使用它，以确保他们继续工作直到工作完成。

我认为这种方法是合理的，但我怀疑我的设计错误。为什么？因为我很快意识到一旦工作完成我并没有关闭每个工人，所以我尝试修改 sendWorkUni() 如下：

function sendWorkUnit(worker) {
  if (workCount < testData.length) {
    worker.postMessage(testData[workCount++]);
  } else {
    worker.terminate();
  }
}

但是，当我进行此更改时，整个事情都会爆炸，我只能取回数组的前 4 个元素。任何解释或指示将不胜感激！

管理器.js

window.onload = function() {
  var numWorkers = 5,
      workers = [],
  testData = ['f', 'o', 'o', 'b', 'a', 'h'],
  workCount = 0,
  ol = document.querySelector('#output');

//Spawn some workers
for (var i = 0; i < numWorkers; i++) {
  var worker = new Worker('worker.js');
  worker.addEventListener('message', function(e) {
    displayWorkUnit(e);
    sendWorkUnit(worker);
  }, false);
  workers.push(worker);
}

//Start the workers
for (var i = 0, l = workers.length; i < l; i++) {
  sendWorkUnit(workers[i]);
}  

//Send next unit
function sendWorkUnit(worker) {
  if (workCount < testData.length) {
    worker.postMessage(testData[workCount++]);
  } 
}

//Display each worker's output
function displayWorkUnit(e) {
  var li = document.createElement('li');
  li.innerHTML = e.data;
  ol.appendChild(li);
}

}

工人.js

self.addEventListener('message', function(e) {
  postMessage(e.data.toUpperCase());
}, false);