码迷,mamicode.com
首页 > 编程语言 > 详细

JavaScript 中的多线程通信

时间:2014-11-20 00:05:19      阅读:209      评论:0      收藏:0      [点我收藏+]

标签:style   blog   io   ar   color   os   使用   sp   java   

本文参考《Html 5 与 CSS 3 权威指南》

     在Html 5诞生之后,我们可以使用javascript来实现多线程处理。H5 新增了一个web workers api,使用这个API,用户可以很容易地创建在后台运行的线程,H5 中被称为workder ,如果将费时比家长的操作放到后台去执行,对用户在界面的操作就完全没有影响了。

   创建后台线程也十分的简单,只要在workder类的构造器中将需要执行的脚本文件的url作为参数,然后创建worker对象就可以了,如下所示

     var worker = new Worker("test.js")

        在创建了worker对象之后,我们可以通过worker的postMessage()来向后台线程发送消息。可以使用onmessage(msg) 来获取消息。

      下面我们来看一下多线程之间通信,在这里实现多个worker之间通信实际上需要借助主线程,子线程A将消息发送给主线程,然后主线程将A线程发送的消息发送给B.下面是实现的代码。

    

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<script>
			var sendWorker = new Worker("js/send.js");     //消息发送线程
			var receiveWorker = new Worker("js/receive.js");  //消息接送线程
			sendWorker.onmessage = function(msg)
			{
				receiveWorker.postMessage(msg.data); //接收到消息之后马上发给接受线程
			}
			
			function sendMessage()
			{
				sendWorker.postMessage("");  //启动消息发送线程发送消息。
			}
		</script>
		
		<input type="button" value="通信" onclick="sendMessage()"/>
	</body>
</html>

send.js

onmessage = function(msg)
{
	postMessage("这个是子线程A 发送的消息");// 线程A 发出消息	
}


receive.js

onmessage = function(msg)
{
	//alert(msg.data); //这句话会报错,因为当前这个方法是在子线程中执行,所以不能使用alert,因为这个会影响UI
	console.log(msg.data);  // 接受线程在控制台输出
}

最后说一下workder之中可用的变量,函数,类


self :该关键字用来本线程的范围。

postMessage(msg) 向创建线程的源窗口发送消息。

onmessage 获取接受消息的事件 句柄。

importScripts(urls) 导入其他的javascript脚本。

使用navigator对象。

使用sessionStorage/localStorage

使用ajax请求

嵌套线程

close结束本线程。

setTimeout/setInterval

eval().isNaN()等,可以使用所有javascript核心函数。

object 

可以使用WebSockets api. 



文章内容如有错误,请批评指正。



















JavaScript 中的多线程通信

标签:style   blog   io   ar   color   os   使用   sp   java   

原文地址:http://blog.csdn.net/liuwei0604/article/details/41292149

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!