Web Workers可以讓web應(yīng)用程序具備后臺(tái)處理能力，使用Worker類加載一個(gè)javascript文件來開辟一個(gè)新的線程，起到互不阻塞執(zhí)行的效果，并且提供主線程和新線程之間數(shù)據(jù)交換的接口：postMessage，onmessage。
主線程：
- 初始化Web Workers:
worker = new Worker(URL); //URL可以是絕對路徑或者是相對路徑，只要同源的就行
- 向worker發(fā)送數(shù)據(jù)
postMessage(data);
- 收worker發(fā)送過來的數(shù)據(jù)
worker.onmessage = function (e) {
console.log(e.target); //用來指向發(fā)送信息的worker
console.log(e.data); //事件的data屬性存有消息內(nèi)容
}
- 發(fā)送錯(cuò)誤時(shí)的執(zhí)行函數(shù)
worker.onerror = function (e) {
console.log(
e.message, //錯(cuò)誤信息
e.filename, //錯(cuò)誤文件名
e.lineno //錯(cuò)誤行
)
}
- 終止一個(gè)worker的執(zhí)行
worker.terminate()
worker線程：
- 在worker中載入其他javascript文件
importScripts("worker1.js", "worker2.js", "worker3.js"); //它們會(huì)安順序執(zhí)行
- 接受主線程發(fā)過來的數(shù)據(jù)
onmessage = function (e) {
var msg = e.data;
}
- 向主線程發(fā)送數(shù)據(jù)
postMessage(data)
- 自己終止worker
self.close()
提醒：
- worker內(nèi)代碼不能訪問DOM，可以訪問navigator的部分屬性
- 不能跨域加載JS
- 可以使用XMLHttpRequest來發(fā)送請求
示例：
//啟動(dòng)worker
var worker = new Worker("worker.js");
worker.postMessage(1);
worker.onmessage = function (e) {
console.log(e.data);
}
//worker
onmessage = function (e) {
var n = e.data;
n++;
postMessage(n);
}
