标签：
为了进行后台计算提供的完全隔离计算方式
不可访问 DOM APIs
不可访问 window object
不可访问 document object
强隔离保证并行计算结果无误(无锁机制)
---- 启动
定义Worker对象
var w = new Worker("calc.js");
Worker会占用比非Worker模式更多内存
硬件好,效率高
---- 通信
Message事件用于和调用方通信
addEventListener(‘message‘,function(evt){});
postMessage()用于向Worker发消息
w.postMessage(imgData);
数据会被格式化成为JSON格式
每次发送都是源对象的copy,对象大,性能降低明显
---- Worker 可访问接口
SetTimeout()/clearTimeout()
setInterval()/clearInterval()
importScripts()引入其它JS文件
可以读取url
可以发送xmlhttprequest
Shared worker 共享数据
---- 算闰年的示例
1. HTML 设计
<form name="stepForm"> 选择速度： <select name="step"> <option value="1">1 sec</option> <option selected="" value="10">10 sec</option> <option value="60">1 min</option> <option value="120">2 min</option> </select> <p>Jahr-Monat: <span id="y">0</span></p> <input id="start" type="button" onclick="startCalc();" value="Start"> <input id="stop" type="button" onclick="stopCalc();" value="Stop"> <pre id="cnt"></pre> </form>
2. JS的 设计
window.onload = function() { var opts = document.forms.stepForm.step.options; // 开始事件 startCalc = function() { var step = opts[opts.selectedIndex].value; var w = new Worker(‘date_worker.js‘); // 创建 Worker 对象 // 发数据到woker w.postMessage(step); $("start").disabled = ‘disabled‘; // 返回数据触发事件 w.onmessage = function(evt) { if (evt.data.substr(0,2) == "y ") { $("y").innerHTML = evt.data.substr(2); } else { $("cnt").innerHTML += "Schaltjahr: "+evt.data+"\n"; } } // 服务停止事件 stopCalc = function() { w.terminate(); // 中断连接 $("start").removeAttribute("disabled"); } } }
3. date_worker.js 设计
addEventListener(‘message‘, function(evt) { var today = new Date(); var oldMonth = -1; // evt.data 即传进来的参数 for (var i=0; i<today; i+=Number(evt.data)*1000) { var d = new Date(i); if (d.getDate() == 29 && d.getMonth() == 1 && d.getHours() == 12 && d.getMinutes() == 0) { // 返回数据 postMessage(d.toLocaleString()); } if (d.getMonth() != oldMonth) { // 返回数据 postMessage("y "+d.getFullYear()+"-" +(d.getMonth()+1)); oldMonth = d.getMonth(); } } }, false);
标签：
原文地址：http://www.cnblogs.com/xgao/p/4200994.html
