Javascript #onmessage和#postmessage如何在主线程和HTML5'之间进行通信；谁是网络工作者？

我正在从了解HTML5工作者，作者使用

self.onmessage

和

self.postmessage

在主线程和工作者之间进行通信，“因为工作者无法访问DOM。”但在下面的例子中，似乎

self

同时指主线程和工作者

function CalculatePi(loop)
{
    var c = parseInt(loop);
    var f = parseFloat(loop);
    var n=1;

    //these errors will need more work…
    if (isNaN(c) || f != c ) {
      throw("errInvalidNumber");
    } else if (c<=0) {
      throw("errNegativeNumber");
    }

    for (var i=0,Pi=0;i<=c;i++) {
      Pi=Pi+(4/n)-(4/(n+2));
      n=n+4;
    }
    self.postMessage({'PiValue': Pi});
}
//wait for the start 'CalculatePi' message
//e is the event and e.data contains the JSON object
self.onmessage = function(e) {
  CalculatePi(e.data.value);
}

---

当工作者不应该访问DOM时，这是如何工作的？它显然在这里使用document.getElementById。

在文件worker.js中，将

self.postMessage

视为工作者（self）的命令/指令应该发布一条消息。因为它只能与创建它的mainJS通信，所以此消息会发送到那里。：） 同样，在mainJS

worker.onmessage

中，应该理解为“一条消息来自worker”事件

因此，基本上在两个脚本中都有两个选项： 在mainJS中：

worker.postMessage（“message”）；

向工作者发送消息-和

worker.onmessage=function（event）{…}

侦听来自工作者的消息

---

在worker脚本中：

（self或）this.onmessage=function（event）{…}

侦听来自mainJS和

self.postMessage（“消息”）的消息；

将内容发送回mainJS

self是worker运行时，它提供了与主线程对话的机制。worker是主线程的一个接口，允许主线程与worker对话。运行时与接口有何不同？self和worker似乎都是对worker线程的相同引用。哦，还有你的最后一个问题：不，worker没有访问DOM的权限。但是mainJS有。它只是通过更改DOM（添加Pi值）来响应onmessage事件。因此，在您的文件worker.js中，不要尝试访问或引用任何DOM元素。这不会起作用。最棘手的是，从主文件中，worker.onmessage的收件人是主线程，但在worker脚本中，This.onmessage的收件人是worker。它们都是属于同一对象的同一方法，那么为什么收件人是different？是因为它是从不同的脚本调用的吗？是的，我相信用外行的术语来理解它（这是我所能得到的大部分）它与调用的位置有关。我不认为Receipt是同一个对象（虽然技术上是），但我只是记住，

worker/self.onmessage（function（e）{…}）

始终听取对方的意见。

worker.onmessage = function(e) {
  document.getElementById("PiValue").innerHTML = e.data.PiValue;
};