使用JavaScript创建工作线程的方法和注意点

19 min read

使用Worker()构造函数可以创建一个Web Worker线程,例如:

// 创建worker线程
const myWorker = new Worker('worker.js');

// 向worker线程发送消息
myWorker.postMessage('Hello from main thread!');

// 监听worker线程返回消息
myWorker.onmessage = function(event) {
  console.log(`Received message from worker: ${event.data}`);
};

// 监听worker线程报错信息
myWorker.onerror = function(error) {
  console.error(`Error from worker: ${error}`);
};

注意,上面代码中的worker.js是Web Worker线程所在的脚本文件,你需要在该文件中定义worker线程的功能和行为。例如:

// worker.js文件
addEventListener('message', function(event) {
  console.log(`Received message in worker: ${event.data}`);
  const result = doSomeWork(event.data);
  // 向主线程发送消息
  postMessage(result);
});

function doSomeWork(data) {
  // 执行一些耗时的操作,并返回结果
  return data.toUpperCase();
}

上面代码中,addEventListener('message', ...)用来监听从主线程发送的消息,postMessage(...)用来向主线程发送结果。