主程序
<!DOCTYPE html>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<title></title>
<style>
span
{
padding: 10px;
}
</style>
<script src=”../jquery-1.7.1.js” type=”text/javascript”></script>
<script type=”text/javascript”>
$(document).ready(function () {
var worker = new Worker(‘t1.js’);
worker.postMessage(”);
worker.onmessage = function (e) {
var arr = e.data.split(‘;’);
for (var i = 0, len = arr.length; i < len; i++) {
var dom = $(‘<span>’ + arr[i] + ‘</span>’);
$(‘#body’).append(dom);
}
}
});
</script>
</head>
<body>
<div id=’body’ style=’ width: 400px; word-break:break-all; word-wrap:break-word; ‘>
</div>
</body>
</html>
复制代码
生成数组的程序
onmessage = function (e) {
var arr = [];
for (var i = 0; i < 100; i++) {
arr.push(parseInt(Math.random() * 100));
}
var worker = new Worker(‘t2.js’);
worker.postMessage(JSON.stringify(arr));
worker.onmessage = function (e) {
//把挑选结果发回前台
postMessage(e.data);
};
}
复制代码
判断数组所有数据是否被3整除
onmessage = function (e) {
var arr = JSON.parse(e.data);
var str = ”;
for (var i = 0, len = arr.length; i < len; i++) {
if (parseInt(arr[i]) % 3 == 0) {
if (str != ”) str += ‘;’;
str += arr[i];
}
}
postMessage(str);
close();
};

程序逻辑描述:
这里用了个线程嵌套
首先执行前台程序,这里初始化了一个子线程“t1”用于将100个数组初始化
然后子线程t1又初始化了子线程t2(用于遍历数组,取出能被3整除的数字,组成字符串),t1将数组数据传给t2
t2 接收t1数据,计算后将将字符串转给t1,t1转给前台,前台执行自己的逻辑
流程结束
结语
简单来说,我这里就是声明子线程,然后发送数据给子线postMessage,然后等待结果皆可。
这里看来,结合上次的通信API Web Sockets ,可以将2个结合做一个网页聊天程序,甚至还可以将本地存储/本地数据库一些东西用到。
这个样子可能是个不错的东西。









