HTML5之web workers_动力节点Java学院整理
|
浏览器将列出的脚本加载并运行。每个脚本中的全局对象都能够被 worker 使用。如果脚本无法加载，将抛出NETWORK_ERROR异常，接下来的代码也无法执行。而之前执行的代码(包括使用window.setTimeout()延迟执行的代码)却依然能够使用。importScripts()之后的函数声明依然能够使用，因为它们始终会在其他代码之前运行。注意：脚本的下载顺序不固定，但执行时会按照你将文件名传入到importScripts()中的顺序。这是同步完成的；直到所有脚本都下载并运行完毕，importScripts()才会返回。 例子 本节提供了几个如何使用 DOM worker 的例子。 在后台执行运算 worker 的一个优势在于能够执行处理器密集型的运算而不会阻塞 UI 线程。在下面的例子中，worker 用于计算斐波那契数。 JavaScript 代码 下面的 JavaScript 代码保存在「fibonacci.js」文件中，与下一节的 HTML 文件关联。 var results = []; function resultReceiver(event) { results.push(parseInt(event.data)); if (results.length == 2) { postMessage(results[0] + results[1]); } } function errorReceiver(event) { throw event.data; } onmessage = function(event) { var n = parseInt(event.data); if (n == 0 || n == 1) { postMessage(n); return; } for (var i = 1; i <= 2; i++) { var worker = new Worker("fibonacci.js"); worker.onmessage = resultReceiver; worker.onerror = errorReceiver; worker.postMessage(n - i); } }; worker 将属性onmessage设置为一个函数，当 worker 对象调用postMessage() 时该函数会接收到发送过来的信息。(注意，这么使用并不等同于定义一个同名的全局变量，或是定义一个同名的函数。var onmessage与function onmessage将会定义与该名字相同的全局属性，但是它们不会注册能够接收从创建 worker 的网页发送过来的消息的函数。) 这会启用递归，生成自己的新拷贝来处理计算的每一个循环。 HTML 代码 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>Test threads fibonacci</title> </head> <body> <div id="result"></div> <script language="javascript"> var worker = new Worker("fibonacci.js"); worker.onmessage = function(event) { document.getElementById("result").textContent = event.data; dump("Got: " + event.data + "n"); }; worker.onerror = function(error) { dump("Worker error: " + error.message + "n"); throw error; }; worker.postMessage("5"); </script> </body> </html> 网页创建了一个div元素，ID 为result， 用它来显示运算结果，然后生成 worker。在生成 worker 后，onmessage处理函数配置为通过设置div元素的内容来显示运算结果，然后onerror处理函数被设置为转储错误信息。最后，向 worker 发送一条信息来启动它。 （编辑：常州站长网） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |
