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 承载了越来越 ...
随机推荐
- 【常识】常用RGB颜色对照表
RGB颜色表 白色:rgb(255,255,255) 黑色:rgb(0,0,0) 红色:rgb(255,0,0) 绿色:rgb(0,255,0) 蓝色:rgb(0,0,255) 青色:rgb(0,25 ...
- 每天进步一点点------Xilinx IP 内核
ISE 设计套件 11.1 版本中提供了众多全新的 IP 内核.数学函数:Multiply Adder v2.0 —— 执行两个操作数的乘法,并采用 XtremeDSP™ 解决方案切片将完全精确的乘积 ...
- 下载图片(vue 下载图片)
downloadImg(){ const url = this.imgUrl // window.open(_this.detail.imgUrl) let xmlhttp=new XMLHttpRe ...
- think PHP5中,模板、控制器、JavaScript的url跳转重定向方法
php控制器中的跳转: 1, header()函数是PHP中进行页面跳转的一种十分简单的方法.主要功能是将HTTP协议标头(header)输出到浏览器. header("Location: ...
- Django Auth组件->扩展用户
Auth用户 1.声明用户表 djangauth/settings.py..............................AUTH_USER_MODEL = 'app01.UserInfo' ...
- 7_1 除法(UVa725)<选择合适的枚举对象>
如果把数字0到9分配成2个整数(各五位数),现在请你写一支程序找出所有的配对使得第一个数可以整除第二个数,而且商为N(2<=N<=79),也就是:abcde / fghijk = N这里每 ...
- AcWing 850. Dijkstra求最短路 II 堆优化版 优先队列 稀疏图
//稀疏图 点和边差不多 #include <cstring> #include <iostream> #include <algorithm> #include ...
- [爬坑日记] 安卓模拟器1903蓝屏 没开hyper-v
先说解决方案: 我在升级完1903之后短短几个小时蓝屏了两次 还是不同原因,不由得开始怀疑这个版本的稳定性,随后发现只有启动安卓模拟器的时候必然蓝屏(还有一次蓝屏实在安装驱动的时候) 经过百度得知需要 ...
- 【音乐欣赏】《Siren》 - The Chainsmokers / Aazar
曲名:Siren 作者:The Chainsmokers . Aazar [00:00.00] 作曲 : Alex Pall/Andrew Taggart/Alexis Duvivier [00:01 ...
- centos 6.10 安装mysql 5.7.27 出现缺少libnuma.so.1的问题
centos 6.10安装mysql 5.7.27出现以下报错: [root@localhost /]# /usr/local/mysql/app/mysql/bin/mysqld --default ...