Web Workers
可以在浏览器后台运行的js,浏览器线程,和浏览器后台线程, 线程孤立于window作用域, 对象数据需要通过 postMessage 进行传递处理, 对象
浏览器特性
if (window.Worker) {
// 支持 Worker
}
通信方式
`index.html`
// 启动一个线程 运行`${location.pathname}/hello.js`
var w = new Worker('hello.js');
// window 发送data 给 hello.js
w.postMessage({
msg: 'hello world'
});
// 接受线程调用的postMessage(data);
w.onmessage = function (event) {
document.body.innerHTML = event.data;
}
`hello.js`
// DedicatedWorkerGlobalScope 对象
console.log(this);
// 当 worker.postMessage(data); 有用
// 调用 onmmesage 函数
var onmessage = function (event) {
// event instanceof MessageEvent
var data = event.data;
if (data.msg) {
postMessage('worker.onmessage:' + data.msg);
}
};
结果
<body>
worker.onmessage
</body>
Worker API
worker.postMessage(data);
推送数据信息给 worker控制的线程
worker.onmessage = function (event) {};
收到worker控制线程推送的data出发onmessage事件
worker.onerror = function (event) {};
线程内抛出异常,并且未捕获触发onerror事件
worker.terminate();
中断线程运行
webwork 和 dom
由于 web worker 位于外部文件中,它们无法访问下例 JavaScript 对象
- window 对象
- document 对象
- parent 对象
错误的例子:
var a = new Worker('demo.js');
// Uncaught DOMException
a.postMessage({
window: window,
document: document
});