序:js 是单线程单进程模式,所有任务只能在一个线程上面顺序执行。在存在高计算的代码运行时,会阻带掉页面的相关操作。所以需要Web Worker创建子进程进行高计算的代码运行,并且将计算结果回传给主进程。
基本使用:
var worker = new Worker('xxx.js');
主进程:
worker.postMessage(); // 发消息
worker.onmessage = function(event){ //接消息
console.log(event.data)
}
worker.terminate() // 关闭
worker.onerror(funtion(){}) // worker.addEventListener('error',function(event){}) // 监听错误
worker线程(子线程):
self.postMessage() // 发消息
self.addEventListener('message',function(event){ // 接消息
console.log(event.data)
},false)
self.close() //关闭
self.addEventListener('error',function(event){}) // 监听错误
importScripts('xxxx1.js','xxxx2.js') // 加载其他子文件
数据通信:
1、可以传文本也可以是对象
2、传值而不是传址
3、通信运行机制:通信内容串行化为字符串
4、针对传送二进制数据优化,主进程直接转移数据,不进行拷贝。,worker.postMessage(arrayBuffer,[arrayBuffer]);
同页面Web Worker
整体操作:
注意事项:
1、同源资源。Worker线程运行的脚本文件必须与主进程的脚本文件同源
2、DOM限制。全局对象无法读取window、parent、document.可以读取navigator、location
3、通信联系。Worker线程与主线程不在一个上下文
4、脚本限制。Worker线程不能执行 alert() 和 confirm(),可以使用 XMLHttpRequest对象
5、文件限制。Worker线程无法读取本地文件