Web Worker双向通信依靠postMessage()与onmessage机制实现独立双通道：主线程用worker.postMessage()发送数据，Worker内用self.onmessage接收；Worker用self.postMessage()回传，主线程监听worker的message事件获取结果。
Web Worker 的双向通信本质是“主线程发消息、Worker 收消息；Worker 发消息、主线程收消息”，靠的是 postMessage() 和 onmessage 这对配套机制，不是单向管道，而是两个方向各自独立的消息通道。
主线程怎么发消息给 Worker
主线程创建 Worker 实例后，直接调用其 postMessage() 方法即可发送数据：
- 数据可以是字符串、数字、对象、数组，甚至
ArrayBuffer（配合transfer参数实现零拷贝） - 不支持函数、
undefined、DOM 节点等无法结构化克隆的值 - 示例：
worker.postMessage({type: 'process', data: [1,2,3]})
Worker 怎么收主线程的消息
在 Worker 脚本内部，监听全局的 onmessage 事件（或用 addEventListener('message', ...)）：
前端设计优化skill
下载
前端设计与 UI/UX 全方位优化专家。覆盖视觉层次、排版系统、色彩理论、响应式布局、交互体验、动画动效、无障碍访问、性能优化八大维度，帮助开发者将普通页面升级为高品质产品级界面。前端设计与 UI/UX 全方位优化专家。覆盖视觉层次、排版系统、色彩理论、响应式布局、交互体验、动画动效、无障碍访问、性能优化八大维度，帮助开发者将普通页面升级为高品质产品级界面。
-
event.data就是主线程传来的数据，类型与发送时一致 - Worker 中没有
window或document，但有self，所以常写成self.onmessage = ... - 收到后可立即处理，比如做排序、加密、解析大 JSON
Worker 怎么主动回传结果给主线程
Worker 用 self.postMessage() 向主线程发消息，和主线程调用方式完全对称：
立即学习“前端免费学习笔记（深入）”；
- 主线程需提前在
worker实例上监听message事件：worker.addEventListener('message', e => console.log(e.data)) - Worker 内部执行完任务后，调用
self.postMessage(result)即可 - 如果需要传大数组或二进制数据，建议用
transfer参数避免复制开销
实际通信中要注意的关键点
双向通信看似简单，但容易踩坑：
- 消息是异步的，不能假设发完立刻收到——必须靠事件回调处理响应
- 结构化克隆会深拷贝对象，频繁传大对象会卡顿；优先用
ArrayBuffer+transfer - 主线程和 Worker 之间没有共享内存，所有通信都是值传递，不存在引用共享
- Worker 出错不会中断主线程，但错误不会自动抛到主线程，需在 Worker 内主动
self.postMessage({error: ...})
