[tr][td] Web Workers 是 HTML5 提供的一个javascript多线程解决方案,我们可以将一些大计算量的代码交由web Worker运行而不冻结用户界面。
一:如何使用Worker Web Worker的基本原理就是在当前javascript的主线程中,使用Worker类加载一个javascript文件来开辟一个新的线程,起到互不阻塞执行的效果,并且提供主线程和新线程之间数据交换的接口:postMessage,onmessage。 那么如何使用呢,我们看一个例子: [*]//worker.js [*]onmessage =function (evt){ [*] var d = evt.data;//通过evt.data获得发送来的数据 [*] postMessage( d );//将获取到的数据发送会主线程 [*]} 复制代码 HTML页面:test.html [*] [*] [*] [*] [*] [*] [*] [*] 复制代码 Chrome浏览器打开test.html后,控制台输出 ”hello world” 表示程序执行成功。通过这个例子我们可以看出使用web worker主要分为以下几部分。 WEB主线程: 1.通过 worker = new Worker( url ) 加载一个JS文件来创建一个worker,同时返回一个worker实例。 2.通过worker.postMessage( data ) 方法来向worker发送数据。 3.绑定worker.onmessage方法来接收worker发送过来的数据。 4.可以使用 worker.terminate() 来终止一个worker的执行。 worker新线程: 1.通过postMessage( data ) 方法来向主线程发送数据。 2.绑定onmessage方法来接收主线程发送过来的数据。 二:Worker能做什么 知道了如何使用web worker ,那么它到底有什么用,可以帮我们解决那些问题呢。我们来看一个fibonacci数列的例子。 大家知道在数学上,fibonacci数列被以递归的方法定义:F0=0,F1=1,Fn=F(n-1)+F(n-2)(n>=2,n∈N*),而javascript的常用实现为: <div class="blockcode"><div id="code_U1Y"><ol>var fibonacci =function(n) { <font size="3"> return n |
|