加载分线程执行的js文件 * Worker.prototype.onmessage: 用于接收另一个线程的回调函数 *
可以让js在分线程执行
Worker
var worker = new Worker('worker.js'); worker.onMessage = function(event){event.data} : 用来接收另一个线程发送过来的数据的回调 worker.postMessage(data1) : 向另一个线程发送数据问题:
worker内代码不能操纵DOM更新UI
不是每个浏览器都撑持这个新特性
不能跨域加载JS
svn版本控制
svn server
demo：使用 web workers计算斐波那契，，验证执行效率
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>06_Web Workers_测试</title> </head> <body> <!-- 1. H5规范供给了js分线程的实现, 取名为: Web Workers 2. 相关API * Worker: 结构函数, 加载分线程执行的js文件 * Worker.prototype.onmessage: 用于接收另一个线程的回调函数 * Worker.prototype.postMessage: 向另一个线程发送动静 3. 不敷 * worker内代码不能操纵DOM(更新UI) * 不能跨域加载JS * 不是每个浏览器都撑持这个新特性 --> <input type="text" placeholder="数值" id="number"> <button id="btn">计算</button> <script type="text/javascript"> // 1 1 2 3 5 8 f(n) = f(n-1) + f(n-2) function fibonacci(n) { return n <= 2 ? 1 : fibonacci(n - 1) + fibonacci(n - 2) } document.querySelector('#btn').onclick = function() { console.log(11); let val = document.querySelector('#number').value console.log(fibonacci(val)); } </script> </body> </html>demo：使用 web workers计算斐波那契，验证执行效率
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>06_Web Workers_测试</title> </head> <body> <!-- 1. H5规范供给了js分线程的实现, 取名为: Web Workers 2. 相关API * Worker: 结构函数, 加载分线程执行的js文件 * Worker.prototype.onmessage: 用于接收另一个线程的回调函数 * Worker.prototype.postMessage: 向另一个线程发送动静 3. 不敷 * worker内代码不能操纵DOM(更新UI) * 不能跨域加载JS * 不是每个浏览器都撑持这个新特性 --> <input type="text" placeholder="数值" id="number"> <button id="btn">计算</button> <script type="text/javascript"> // 1 1 2 3 5 8 f(n) = f(n-1) + f(n-2) function fibonacci(n) { return n <= 2 ? 1 : fibonacci(n - 1) + fibonacci(n - 2) //递归挪用 } // console.log(fibonacci(7)) var input = document.getElementById('number') document.getElementById('btn').onclick = function() { var number = input.value var result = fibonacci(number) alert(result) } </script> </body> </html> function fibonacci(n) { return n <= 2 ? 1 : fibonacci(n - 1) + fibonacci(n - 2) //递归挪用 } console.log(this) this.onmessage = function(event) { var number = event.data console.log('分线程接收到主线程发送的数据: ' + number); //计算 var result = fibonacci(number) postMessage(result) console.log('分线程向主线程返回数据: ' + result); // alert(result) alert是window的要领, 在分线程不能挪用 // 分线程中的全局东西不再是window, 所以在分线程中不成能更新界面 }285 H5 Web Workers
标签：
原文地点：https://www.cnblogs.com/jianjie/p/12257440.html
温馨提示: 本文由Jm博客推荐，转载请保留链接: https://www.jmwww.net/file/web/30598.html
![[转]Node.js中package.json中^和~的区别](/uploads/allimg/200519/054J34453_lit.png "[转]Node.js中package.json中^和~的区别")