MessageChannel 是一个用于在两个线程之间传递消息的接口。它允许两个线程之间进行通信，而不需要使用任何同步机制。换句话说，就是可以让两个不同的脚本运行在同一个文档的不同浏览器上下文中，（例如两个 iframe，文档主体和一个 iframe、使用 sharedWorker 的两个文档或两个 worker）来直接通讯，在每端使用一个端口 port 通过双向频道 channel 向彼此传递消息。

MessageChannel是以DOM Event的形式发送消息，因此它属于异步的宏任务。

MessageChannel 如果使用addEventListener方式监听message事件，那么message事件会在DOM Event之后触发,并且在此之前需要手动调用start()方法才能使消息流动，而onmessage方式监听则会在DOM Event之前触发，且自动调用start()方法。

具体使用步骤如下

1. 创建MessageChannel实例（通讯通道），new MessageChannel()会返回两个端口 MessagePort 对象port1、port1
2. port1、port2分别用于postMessage发送消息和onmessage接受消息
3. MessageChannel实现消息传递是深拷贝，因此消息需要是可以进行反序列化的大多数原始对象，像Symbole、Function则不能用作消息
4. 调用close方法关闭端口，将不能向该端口发送消息

示例

var channel = new MessageChannel();
console.log("🚀 ~ channel:", channel);
var port1 = channel.port1;
console.log("🚀 ~ port1:", port1);
var port2 = channel.port2;
console.log("🚀 ~ port2:", port2);

port1.onmessage = function (event) {
  console.log("port1：" + event.data);
};

port2.onmessage = function (event) {
  console.log("port2：" + event.data);
};

port1.postMessage("我是port1，发送给port2");
port2.postMessage("我是port2，发送给port1");
port1.close();