当前位置：首页 > JavaScript

js实现线程

2026-03-14 02:28:27JavaScript

在JavaScript中，由于语言设计本身的单线程特性，无法直接创建传统意义上的线程（如Java或C++中的多线程）。但可以通过以下方式模拟类似多线程的并发执行或利用现代浏览器和Node.js提供的特性实现并行处理：

Web Worker（浏览器环境）

Web Worker允许在后台线程中运行脚本，避免阻塞主线程。适用于CPU密集型任务。

// 主线程代码
const worker = new Worker('worker.js');
worker.postMessage({ data: '任务数据' });

worker.onmessage = (e) => {
  console.log('收到Worker结果:', e.data);
};

// worker.js
self.onmessage = (e) => {
  const result = e.data.data.toUpperCase(); // 模拟处理
  self.postMessage(result);
};

Service Worker

主要用于离线缓存和网络请求拦截，属于特殊类型的Web Worker。

// 注册Service Worker
navigator.serviceWorker.register('sw.js').then(registration => {
  console.log('注册成功');
});

Node.js的Worker Threads

Node.js通过worker_threads模块支持真正的多线程操作，适合CPU密集型任务。

const { Worker, isMainThread } = require('worker_threads');

if (isMainThread) {
  const worker = new Worker(__filename);
  worker.on('message', (msg) => console.log(msg));
} else {
  parentPort.postMessage('来自线程的消息');
}

异步编程模式

虽然非真正多线程，但通过事件循环可实现非阻塞操作：

// Promise链
fetch('url')
  .then(res => res.json())
  .then(data => console.log(data));

// async/await
async function fetchData() {
  const res = await fetch('url');
  const data = await res.json();
  return data;
}

SharedArrayBuffer与Atomics

允许线程间共享内存（需谨慎使用，存在安全限制）：

js实现线程

// 主线程
const sharedBuffer = new SharedArrayBuffer(1024);
worker.postMessage({ buffer: sharedBuffer });

// Worker线程
self.onmessage = (e) => {
  const sharedArray = new Int32Array(e.data.buffer);
  Atomics.add(sharedArray, 0, 1); // 原子操作
};