在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.下面是实现的代码。

a href="http://www.codesec.net/kf/qianduan/css/" target="_blank" class="keylink">html>
<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>

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 中的多线程通信的方法的更多相关文章

  1. 总结Javascript中数组各种去重的方法

    相信大家都知道网上关于Javascript中数组去重的方法很多,这篇文章给大家总结Javascript中数组各种去重的方法,相信本文对大家学习和使用Javascript具有一定的参考借鉴价值,有需要的 ...

  2. JavaScript中类似PHP的uniqid()方法

    JavaScript中类似PHP的uniqid()方法: function generateUIDNotMoreThan1million() { return ("0000" + ...

  3. 深入了解JavaScript中的Symbol的使用方法

    这篇文章主要介绍了深入了解JavaScript中的Symbol的使用方法,本文针对ES6版本的JS进行讲解,需要的朋友可以参考下 Symbol 是什么? Symbols 不是图标,也不是指在代码中可以 ...

  4. JavaScript中Number常用属性和方法

    title: JavaScript中Number常用属性和方法 toc: false date: 2018-10-13 12:31:42 Number.MAX_VALUE--1.79769313486 ...

  5. Javascript中对象的Obeject.defineProperty()方法-------------(ES5/个人理解)

    在讲到Obeject.defineProperty()方法之前先得说明一下ECMAScript中有两种属性:数据属性和访问器属性. 两种属性存在的意义:描述对象属性(key)的一些特性,因为这些属性是 ...

  6. Javascript中的迭代、归并方法

    迭代方法 在Javascript中迭代方法个人觉得尤为重要,在很多时候都会有实际上的需求,javascript提供了5个迭代方法来供我们操作,它们分别为: every() 对数组中的每一个项运用给定的 ...

  7. 在javascript中使用com组件的方法

    转载自:  http://dhailin.blog.163.com/blog/static/230738322011128102043880/ 首先创建一个COM组件,插入一个双接口Itest,在此接 ...

  8. javascript中对象的不同创建方法

    javascript中的对象与一般的面向对象的程序设计语言(c++,Java等)不同,甚至很少有人说它是面向对象的程序设计语言,因为它没有类.javaScript只有对象,不是类的实例.javascr ...

  9. Javascript 中创建自定义对象的方法(设计模式)

    Javascript 中创建对象,可以有很多种方法. Object构造函数/对象字面量: 抛开设计模式不谈,使用最基本的方法,就是先调用Object构造函数创建一个对象,然后给对象添加属性. var ...

随机推荐

  1. 深入浅出 Java Concurrency (39): 并发总结 part 3 常见的并发陷阱

    常见的并发陷阱 volatile volatile只能强调数据的可见性,并不能保证原子操作和线程安全,因此volatile不是万能的.参考指令重排序 volatile最常见于下面两种场景. a. 循环 ...

  2. PAT甲级——A1001A+BFormat

    Calculate a+b and output the sum in standard format -- that is, the digits must be separated into gr ...

  3. java流对象

    Java和C++都是静态类型的面向对象编程语言 stream结尾都是字节流,reader和writer结尾都是字符流 区别: 就是读写的时候一个是按字节读写,一个是按字符. 实际使用通常差不多. 在读 ...

  4. Python2.7安装matplotlib、numpy

    Windows版本 一.从官网下载python2.7,安装过程中把pip给装上,并且把path也选上,就是把自带的工具全选: 二.在cmd下输入python,会进入交互式界面,出了问题很大程度上是因为 ...

  5. Luogu P1850 换教室(期望dp)

    P1850 换教室 题意 题目描述 对于刚上大学的牛牛来说,他面临的第一个问题是如何根据实际情况申请合适的课程. 在可以选择的课程中,有\(2n\)节课程安排在\(n\)个时间段上.在第\(i(1\l ...

  6. thinkcmf报错:fileowner(): stat failed for /sys

    thinkcmf转移到linux云服务器后,后台更新缓存页面报错,错误信息fileowner(): stat failed for /sys 临时解决办法:修改common.php cmf_clear ...

  7. md5密码入库

    <?php //连接数据库 $pdo = new PDO('mysql:host=localhost;dbname=md5;charset=UTF8', 'root', ''); # 设置为fa ...

  8. 软件-SecureCRT:SecureCRT

    ylbtech-软件-SecureCRT:SecureCRT SecureCRT是一款支持SSH(SSH1和SSH2)的终端仿真程序,简单地说是Windows下登录UNIX或Linux服务器主机的软件 ...

  9. create_pascal_tf_record.py 生成的record一直为0字节

    后面发现这个错误原来是自己Main目录下的train.txt中间没东西

  10. HDFS 名称节点的启动