HTML5 : worker API

worker 是异步操作的API

js的执行是以主线程，单线程执行，当遇到耗时的计算时会发生堵塞，这时候需要雇佣一个worker进行异步计算，将计算结果返回给主线程。

worker文件必须和主文件满足同源策略

worker 和主线程之间的通信

postMessage(n)方法
message事件

雇主（index.html） 向工人发出任务数据

var worker = new Worker('./worker.js');
//给worker发送数据
worker.postMessage(12)
复制代码

工人（worker.js） 接受任务数据

onmessage = function(e){
    console.log(e.data);//12
}
复制代码

工人处理index发过来的数据

onmessage = function(e){
    postMessage(deal(e.data));
}
function deal(data){
    return data * data;
}
复制代码

雇主监听工人返回的数据并使用

var worker = new Worker('./worker.js');
worker.postMessage(12)
worker.onmessage = function (e){
    console.log(e.data);//144
}
复制代码

结束一个worker

close()在worker作用域中调用（worker.js）-->辞职
terminate()在worker对象上调用（主进程的worker对象上worker.terminate）-->解雇

close() 辞职，自己不干了

//worker.js
onmessage = function(e){
    postMessage(deal(e.data));
    //取消worker
    close();
}
function deal(data){
    return data * data;
}
//index.html
var worker = new Worker('./worker.js');
worker.postMessage(12)
worker.onmessage = function (e){
    console.log(e.data);
    worker.postMessage(24)//不执行
}
复制代码

terminate()解雇，被炒鱿鱼

//index.html
var worker = new Worker('./worker.js');
worker.postMessage(12)
worker.onmessage = function (e){
    console.log(e.data);
    //取消worker
    worker.terminate();
    worker.postMessage(24);//不执行
}
复制代码

其他特性(兼容性较低不建议使用)

1.importScripts('./math1.js','math2.js')
worker只是window的子集，只能实现部分功能，不能获得到window，document，所有这里不要引入jquery和zepto。可以引入一些计算类的库。
2.作用域globalWorkerScope
   i.可以继续生产worker对象（Chrome暂时还不支持，浏览器支持情况不好）
   ii.navigator
   iii.XMLHttpRequest
   iiii.setTimeout/setInterval