关于webWorker的理解和简单例子

一、理解

webworker并没有改变js单线程的本质，webworker多线程指的是浏览器多线程，因为浏览器可以提供多个js引擎的实例，每个实例可以独立的运行相应的程序，但在每个js引擎实例中js脚本还是在单线程得执行，每个实例就相当于一个webworker。

二、注意点

webworker与主线程之间不能共享资源和作用域，通过异步事件在线程之间传递消息。
webworker中不能访问window，document，parent对象，但是可以访问JSON（看到书上说applicationCache，navigator，location也可以访问，但实验了一下并不能访问，有知道怎么访问的还请指教啦）
同一个页面打开两次或者多次，创建webworker的路径是一样的，但是会创建不同的webworker，且是完全独立的。有些浏览器（Firefox，Chrome的高版本）支持共享Worker，通过 new ShareWorke来创建共享Worker实例

三、基本例子

//index.html

<body>

//子线程向主线程传递消息

var w = new Worker("worker.js");

// w.onmessage=function(e){//监听子线程的message事件

// document.getElementById("num").innerText = JSON.parse(e.data).num;

// }

w.addEventListener("message",function (e){//监听子线程的message事件，既可以采用这种方式，也可以用上边注释里的方式

document.getElementById("num").innerText = JSON.parse(e.data).num;

})

//主线程向子线程传递消息

var btn = document.getElementsByTagName("button")[0];

btn.onclick = function () {

var num= document.getElementsByTagName("input")[0].value;

w.postMessage(num);//向子线程发送message事件

}

var stopBtn = document.getElementsByTagName("button")[1];

stopBtn.οnclick=function() {

w.terminate();//停止webworker

}

</script>

</body>

//worker.js

var obj = {

num :999

}

postMessage(JSON.stringify(obj));

addEventListener("message",function (e) {

obj.num = e.data*2;

postMessage(JSON.stringify(obj));

//postMessage(obj);//报错

})

从这个例子中可看出

子线程内监听消息或者发送消息，直接调用addEventListener、postMessage即可
主线程内监听消息或者发送消息，要调用Worker实例上的addEventListener、postMessage
要想获得通信的实际内容，需要访问回调函数的参数中的data属性
webworker里可以使用JSON来传递复杂类型值

关于webWorker的理解和简单例子相关推荐

关于UMAT的简单例子，以更好的理解UMAT的逻辑
接触了abaqus的umat以后,通过几天的学习,才真正理解umat和Usdfld的区别,umat其实是讲的应力和应变的关系,即本构方程,而usdfld讲的是强度失效后的刚度矩阵如何折减,目前的认识, ...
java 国际化例子_JavaSE 国际化简单例子
①在src下添加两个文件: base_zh_CN.properties Test=\u8fd9\u662f\u4e2d\u6587 base_en_US.properties Test=english ...
组合恒等式7 组合变换的互逆公式简介与简单例子
组合恒等式7 组合变换的互逆公式双重求和可以交换次序互逆公式的证明应用互逆公式证明组合恒等式类似离散序列的Z变换,我们也可以定义以组合数为系数的组合变换,一个直观的例子是 bk=∑i=0k(− ...
C#操作MySQL数据库的简单例子
其实很简单,但是我在网上找的时候却找不到有用的信息,奇怪. 到这里下载驱动 http://www.mysql.com/products/connector/ 下载的包里面有使用的例子. 需要具备的知识 ...
jar包的生成和使用简单例子
一, 什么是jar包 java中, 源代码文件是*.java, 编译后就生成若干class文件. 这些class文件可以被各平台的jvm虚拟机执行. java还提供1个工具, 可以将这些c ...
什么是量子计算机？用一个简单例子来解释
译者:王亮作者:YK Sugi 原文:http://t.cn/EZAElk0 Hi,大家好! 不久前,我参观了加拿大温哥华的D-Wave Systems公司,这是一家制造前沿量子计算机的公司. ...
rest_framework11：jwt简单例子/自定制基于jwt认证类
jwt简单例子一.登陆设置 1.不需要写login的视图类,使用jwt内置的. 2.需要前置条件,已有继承AbstractUser models,并且有数据,用于校验,返回token. urls.p ...
一个简单例子：贫血模型or领域模型
转:一个简单例子:贫血模型or领域模型贫血模型我们首先用贫血模型来实现.所谓贫血模型就是模型对象之间存在完整的关联(可能存在多余的关联),但是对象除了get和set方外外几乎就没有其它的方法,整个 ...
VC API常用函数简单例子大全(1-89)
第一个:FindWindow根据窗口类名或窗口标题名来获得窗口的句柄,该函数返回窗口的句柄函数的定义:HWND WINAPI FindWindow(LPCSTR lpClassName ,LPCST ...

关于webWorker的理解和简单例子

关于webWorker的理解和简单例子相关推荐

最新文章

热门文章