JS利用HTML5的Web Worker实现多线程
需求:有一个长时间的斐波拉契的计算希望放在分线程中计算,计算的得到结果后再返回给主线程展示,再计算的时候不冻结页面
var number = 55;//传入分线程的参数
var worker = new Worker('worker.js');//利用一个js文件创建一个分线程
worker.postMessage(number);//向分线程传入数据
woker.onmessage=function(event){//设置分线程的回调函数,并接收返回的结果
console.log('接收到分线线程返回的数据:'+event.data);
}
下面是worker.js文件中的代码:
var onmessage = function(event){//接收主线程传入的数据并进行计算
var number = event.data;
var result = fibonacci(number);
postMessage(result );//返回主线程并传入返回结果
}
function fibonacci(n){//斐波拉契计算函数
return n<=2?1:fibonacci(n-1)+fibonacci(n-2);
}
注:当worker.js文件作为分线程调用的时候,worker.js文件中的this就不是指向window了,所有再分线程上面是不能使用window自带的很多函数的(比如alert),并且再分线程里面也就访问不到页面的任何元素。所以分线程的定位是只进行计算的,不做任何页面相关的操作。
JS利用HTML5的Web Worker实现多线程的更多相关文章
- Web Worker javascript多线程编程(二)
Web Worker javascript多线程编程(一)中提到有两种Web Worker:专用线程dedicated web worker,以及共享线程shared web worker.不过主要讲 ...
- Web Worker javascript多线程编程(一)
什么是Web Worker? web worker 是运行在后台的 JavaScript,不占用浏览器自身线程,独立于其他脚本,可以提高应用的总体性能,并且提升用户体验. 一般来说Javascript ...
- 【转】Web Worker javascript多线程编程(一)
原文:https://www.cnblogs.com/peakleo/p/6218823.html -------------------------------------------------- ...
- 通过一次实验来了解HTML5的 Web Worker
web worker 是运行在后台的 JavaScript,不会影响页面的性能. 当在 HTML 页面中执行脚本时,页面的状态是不可响应的,直到脚本已完成. web worker 是运行在后台的 Ja ...
- 深入理解javascript异步编程障眼法&&h5 web worker实现多线程
0.从一道题说起 var t = true; setTimeout(function(){ t = false; }, 1000); while(t){ } alert('end'); 1 2 3 4 ...
- html5之web worker
Web Worker 在本文中 与 Web Worker 进行双向通信 WindowTimers 在 IE10 Platform Preview 4 中对 Web Worker 的更新 API 参 ...
- JS多线程之Web Worker
什么是Web Worker web worker 是运行在后台的 JavaScript,不会影响页面的性能. 当在 HTML 页面中执行脚本时,页面的状态是不可响应的,直到脚本已完成. web wor ...
- 深入HTML5 Web Worker应用实践:多线程编程
HTML5 中工作线程(Web Worker)简介 至 2008 年 W3C 制定出第一个 HTML5 草案开始,HTML5 承载了越来越多崭新的特性和功能.它不但强化了 Web 系统或网页的表现性能 ...
- 深入 HTML5 Web Worker 应用实践:多线程编程
深入 HTML5 Web Worker 应用实践:多线程编程 HTML5 中工作线程(Web Worker)简介 至 2008 年 W3C 制定出第一个 HTML5 草案开始,HTML5 承载了越来越 ...
随机推荐
- 【资料】哈代&拉马努金相关,悼文,哈佛演讲,及各种杂七杂八资料整理
悼文和哈佛演讲,因为有一堆公式所以实在懒得放lofter了. 信件和其他资料翻译在这里放个备份,基本上来自<Ramanujan:Letters and commentary>和<Ra ...
- CentOS安装docker,及其基本操作
CentOS安装docker,及其基本操作 一.安装docker Docker要求运行在Centos 7上,要求系统为64位,系统内核版本3.10以上 1.uname -an 查看当前系统版本 2.y ...
- linux下grep分析apache日志的命令集合
https://my.oschina.net/hmc0316/blog/112004 实例:月份英文简写英文全称一月Jan.January二月Feb.February三月Mar.March四月Apr. ...
- 【Python】 数字求和
# 用户输入数字 num1 = input('输入第一个数字:') num2 = input('输入第二个数字:') # 求和 sum = float(num1) + float(num2) # 显示 ...
- 【转载】Java容器的线程安全
转自:http://blog.csdn.net/huilangeliuxin/article/details/12615507 同步容器类 同步容器类包括Vector和Hashtable(二者是早期J ...
- java把带小数点的字符串转换成int类型
String number ="1.0000"; int num =Double.valueOf(number).intValue();//转换为Int类型
- 如何开通linux机器的对外访问端口
1.先查看是否已经开通 2.没有开通,去linux机器查看防火墙,确实没有开通 3.修改防火墙 vim /etc/sysconfig/iptables 4.重启防火墙之后重新查看已经可以看到8000端 ...
- 【红黑树】的详细实现(C++)
红黑树的介绍 红黑树(Red-Black Tree,简称R-B Tree),它一种特殊的二叉查找树.红黑树是特殊的二叉查找树,意味着它满足二叉查找树的特征:任意一个节点所包含的键值,大于等于左孩子的键 ...
- pycharm的一些快捷键[转]
编辑类: Ctrl + Space 基本的代码完成(类.方法.属性)Ctrl + Alt + Space 类名完成Ctrl + Shift + Enter 语句完成Ctrl + P 参数信息(在方法中 ...
- Bugku-CTF之多次
Day33 多次 http://123.206.87.240:9004 本题有2个flag flag均为小写 flag格式 flag{}