// 堆代码 duidaima.com const worker = new Worker('worker.js');参数是包含 Worker 脚本的文件路径。需要注意的是,文件必须与主线程在同源下运行。
worker.postMessage('Hello, Worker!');发送的数据可以是任何可序列化的对象,例如字符串、数字、数组或 JSON 对象。
self.onmessage = function(event) { console.log('Message from Main Thread:', event.data); };event.data 包含主线程发送的数据。
self.postMessage('Hello, Main Thread!');主线程接收 Worker 消息
// 堆代码 duidaima.com worker.onmessage = function(event) { console.log('Message from Worker:', event.data); };捕获错误
worker.onerror = function(error) { console.error('Worker error:', error.message); };在 Worker 内部可以通过throw 抛出错误:
throw new Error('Something went wrong');终止 Worker
worker.terminate();终止后,Worker 将停止执行所有任务。
self.close():关闭当前 Worker。 self.importScripts(...urls):动态加载一个或多个脚本。 self.importScripts('script1.js', 'script2.js');
三.代码示例
以下是一个简单的示例,演示如何使用 Web Worker 计算大数阶乘。const worker = new Worker('factorialWorker.js'); worker.postMessage(10); // 计算 10 的阶乘 worker.onmessage = function(event) { console.log('Factorial result:', event.data); }; worker.onerror = function(error) { console.error('Worker error:', error.message); }; Worker 脚本 (factorialWorker.js) self.onmessage = function(event) { const number = event.data; const result = factorial(number); self.postMessage(result); }; function factorial(n) { if (n === 0 || n === 1) return 1; return n * factorial(n - 1); }实际运用场景举例
const fileWorker = new Worker('fileWorker.js'); // 模拟上传文件并传递给 Worker const fileContent = 'name,age\nAlice,30\nBob,25'; fileWorker.postMessage(fileContent); fileWorker.onmessage = function(event) { console.log('Parsed Data:', event.data); }; Worker 脚本 (fileWorker.js): self.onmessage = function(event) { const csvData = event.data; const parsedData = parseCSV(csvData); self.postMessage(parsedData); }; function parseCSV(data) { const rows = data.split('\n'); const headers = rows[0].split(','); return rows.slice(1).map(row => { const values = row.split(','); return headers.reduce((obj, header, index) => { obj[header] = values[index]; return obj; }, {}); }); }场景 2:复杂计算
const calcWorker = new Worker('matrixWorker.js'); // 模拟两个矩阵数据 const matrixA = [[1, 2], [3, 4]]; const matrixB = [[5, 6], [7, 8]]; calcWorker.postMessage({ matrixA, matrixB }); calcWorker.onmessage = function(event) { console.log('Matrix Multiplication Result:', event.data); }; Worker 脚本 (matrixWorker.js): self.onmessage = function(event) { const { matrixA, matrixB } = event.data; const result = multiplyMatrices(matrixA, matrixB); self.postMessage(result); }; function multiplyMatrices(a, b) { const rowsA = a.length, colsA = a[0].length; const rowsB = b.length, colsB = b[0].length; if (colsA !== rowsB) throw new Error('Matrix dimensions do not match'); const result = Array.from({ length: rowsA }, () => Array(colsB).fill(0)); for (let i = 0; i < rowsA; i++) { for (let j = 0; j < colsB; j++) { for (let k = 0; k < colsA; k++) { result[i][j] += a[i][k] * b[k][j]; } } } return result; }总结