HTML5 Web Worker使用

    Web Worker是HTML5中新增的一项技术，用于Web程序实现后台处理。类似于异步处理。

    在js中运行下列代码：  

var result = 0;
for (var i = 0; i <= 22222222233; i++) {
    result += i;
}
alert(result);

  如果使用的是IE，则会出现如下的提示：

   不同的浏览器运行的效果不同，Firefox表现和IE很相似，提示用户是否停止该脚本；Chrome和Opera则很有耐心，会一直等下去。此时如果页面还有其他元素，如textfiled或button，是没法点击的，因为javascript是同步执行的。Web Worker的出现就是解决此类问题的。

   使用Web Worker代码处理如下：

    首先，创建Worker对象，并添加回调方法。   

//定义Worker对象
//cal.js子线程处理代码
var worker = new Worker("cal.js");
//回调方法
worker.onmessage = function(event) {
	var result = event.data;//子线程中返回的数据
	alert("result:"+result);
};
//向子线程发消息
worker.postMessage(22222222233);

然后，编写子线程代码。（注：以下代码在cal.js文件中）

onmessage = function(event) {
    var num = event.data;
	var result = 0;
	for (var i = 0; i <= num; i++) {
		result += i;
	}
	//发送消息到主线程
	postMessage(result);
};

最后，运行代码，稍等一会（不同硬件环境等待时间不同），就会有运算结果的提示信息了，不会再出现运行超时的提示。在等待过程中如果页面还有其他元素，此时可以进行点击或输入操作。

如果在子线程中创建子线程是否可以呢，答案是肯定的。在子线程中的代码如下：

onmessage = function(event) {
	//创建Worker对象
	var worker = new Worker("thread.js");
	worker.onmessage = function(event) {
	    //向主线程消息
		postMessage(event.data);
	};
	//向子线程发消息
	worker.postMessage("data");
};

注意：Web Worker特性目前并不是所有浏览器都支持，以上Worker特性代码在Chrome 19,Opera 11.11和 Firefox 13.0.1版本测试通过，IE 8 不支持该特性。