web workers可用于后台运行javascript代码以避免阻塞主线程。通过创建独立js文件并实例化worker对象来启动，主脚本中发送数据，worker接收后执行耗时任务如大量计算，并通过postmessage返回结果，实现主线程与worker线程间通信。
Web Workers 允许你在后台线程中运行 JavaScript 代码，不会阻塞主线程（尤其是 UI 线程），特别适合处理耗时任务，比如大量计算、数据处理或轮询等。下面介绍 Web Workers 的基本使用方法。
创建和启动 Web Worker
要使用 Web Worker，你需要创建一个独立的 JavaScript 文件，这个文件将运行在 worker 线程中。然后在主脚本中实例化 Worker 对象来启动它。
假设你有一个文件叫 worker.js：
// worker.js
self.onmessage = function(e) {
const data = e.data;
// 模拟耗时计算
let result = 0;
for (let i = 0; i < data; i++) {
result += i;
}
// 将结果发送回主线程
self.postMessage(result);
};
在主页面中启动这个 worker：
立即学习“Java免费学习笔记（深入）”；
// main.js
const worker = new Worker('worker.js');
worker.postMessage(1000000); // 发送数据给 worker
worker.onmessage = function(e) {
console.log('计算结果：', e.data); // 接收 worker 返回的结果
};
与主线程通信
主线程和 Web Worker 之间通过 postMessage() 发送消息，通过监听 onmessage 事件接收消息。注意：不能直接共享变量，所有通信都是基于消息传递的。
- 主线程使用 worker.postMessage(data) 发送数据
- worker 使用 self.postMessage(result) 返回结果
- 主线程通过 worker.onmessage 接收返回值
- worker 中使用 self.onmessage 监听来自主线程的消息
终止 Web Worker
如果不再需要 worker，应手动关闭以释放资源。
- 在主线程中调用 worker.terminate()
- 在 worker 内部调用 self.close() 可以自行关闭
// 主线程中终止 worker worker.terminate();
注意事项和限制
Web Worker 虽然强大，但有一些限制需要注意：
- 不能访问 DOM，无法操作页面元素
- 不能使用 window、document 等全局对象，可以使用 self、console、fetch 等部分 API
- 传递的数据是复制的（结构化克隆），不是共享引用
- worker 文件必须与主页面同源，且不能通过 file:// 协议加载
