Web Workers 是浏览器提供的后台线程机制，实现 JavaScript 多线程运行以避免阻塞主线程；它与主线程隔离，仅通过 postMessage 通信，支持 Dedicated 和 Shared 两种类型，适用于耗时计算等场景。
Web Workers 是浏览器提供的、让 JavaScript 在后台线程中运行的机制，它能真正实现多线程执行，避免阻塞主线程（即 UI 渲染和用户交互线程）。
Web Workers 的核心作用
JavaScript 本身是单线程的，所有任务（脚本执行、DOM 操作、事件响应等）都在同一个线程上排队运行。一旦遇到耗时计算（比如大数组排序、图像处理、加密解密），页面就会卡顿甚至无响应。Web Workers 把这些重任务“搬”到独立的后台线程里，主线程继续流畅工作。
关键点：Worker 线程与主线程完全隔离，不能访问 DOM、window、document 等全局对象，也不能直接修改页面；通信只能通过 消息机制（postMessage + onmessage） 进行。
如何创建并使用一个 Web Worker
分三步：写 Worker 脚本 → 创建 Worker 实例 → 双向通信
立即学习“Java免费学习笔记（深入）”；
1. 编写 Worker 文件（例如 worker.js）：
在该文件中，可用 self 或 this 表示当前 Worker 全局对象；监听主线程发来的消息，并返回结果：
self.onmessage = function(e) {
const data = e.data;
const result = data * data; // 示例：简单计算
self.postMessage({ result });
};
2. 主线程中启动 Worker：
const worker = new Worker('worker.js');
worker.postMessage(5); // 发送数字 5 给 Worker
3. 主线程监听 Worker 返回结果：
worker.onmessage = function(e) {
console.log('Worker 返回：', e.data.result); // 输出 25
};
常见类型与适用场景
目前主流支持两种 Worker：
Dedicated Worker（专用 Worker）：最常用，一对一绑定，仅被创建它的脚本访问。适合单个复杂计算、数据预处理、轮询后台接口等。Shared Worker（共享 Worker）：多个页面/iframe 可共用同一个 Worker 实例（需同源），通过 port 通信。适合跨标签页共享状态或统一管理长连接。
注意：Service Worker 虽也属 Worker 类型，但定位不同——它是为离线缓存、网络代理设计的，不用于通用计算任务。
注意事项与限制
Worker 脚本必须托管在 HTTP/HTTPS 协议下（file:// 协议会失败）无法使用 alert、confirm、prompt，也不能操作 DOMWorker 内部可使用 fetch、setTimeout、WebSockets、JSON、ArrayBuffer 等，但不可用 localStorage（可用 IndexedDB）记得调用 worker.terminate() 手动销毁不用的 Worker，避免内存泄漏调试时可在 Chrome DevTools 的 “Application → Service Workers” 或 “Sources → Workers” 标签下查看运行中的 Worker
以上就是javascript的Web Workers是什么_如何实现多线程编程的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1544024.html
微信扫一扫 
支付宝扫一扫 
