在 html5 中创建 Web worker 时使用 setTimeout()

Use of setTimeout() in creating web worker in html5

本文关键字:setTimeout worker html5 创建 Web      更新时间:2023-09-26

我正在学习有关网络工作者的教程 - http://www.w3schools.com/html/html5_webworkers.asp

大多数事情对我来说都很清楚,但我不知道使用该函数的目的是什么setTimeout以及postMessage(i)如何将i的值返回给w.onmessage

法典-

var i = 0;
function timedCount() {
    i = i + 1;
    postMessage(i);
    setTimeout("timedCount()",500);
}
timedCount(); 

谁能解释一下这个例子是如何工作的流程?

setTimeout的目的是

在 500 毫秒后调用timedCount。由于它是递归调用的,因此效果是每秒调用两次timedCount

另请注意,这将执行相同的操作:

var i = 0;
function timedCount() {
    i = i + 1;
    postMessage(i);
}
setInterval(timedCount, 500);
function startWorker() {
    if(typeof(Worker) !== "undefined") {
        if(typeof(w) == "undefined") {
            w = new Worker("demo_workers.js");
        }
        w.onmessage = function(event) {
            document.getElementById("result").innerHTML = event.data;
        };
    } else {
        document.getElementById("result").innerHTML = "Sorry! No Web Worker support.";
    }
}

请注意在 w.onmessage 上注册的回拨

当 Web 工作者发布消息时,事件中的代码 侦听器被执行。来自 Web 辅助角色的数据存储在 事件数据。

魔术由SetTimeout函数播放,该函数使用 Webworker 的全局方法以 500 毫秒的间隔递归发布计时器值。 PostMessage

有关帖子消息功能的完整详细信息,请点击此处

帖子消息语法

myWorker.postMessage(aMessage, transferList(;

参数

a留言

要交付给工作人员的对象;这将在 传递到 DedicatedWorkerGlobalScope.onmessage 的事件 处理器。这可以是由 结构化克隆算法,包括循环引用。

转移列表可选

要转让所有权的可转移对象的可选数组。如果 对象的所有权被转移,它变得不可用 (绝育(在发送它的上下文中,它变得可用 仅发送给它被发送到的工人。

只能传输 MessagePort 和 ArrayBuffer 对象。

根据定义,setTimeout(( 方法在指定的毫秒数后调用函数或计算表达式。http://www.w3schools.com/jsref/met_win_settimeout.asp

var i = 0;
function timedCount() {
i = i + 1;
postMessage(i);
setTimeout("timedCount()",500);
}
timedCount();

上面的脚本加载函数 timedCount。变量 i 的初始值为 0。根据等式,i 等于 1 ( 0 + 1(。然后,帖子消息显示 i 的值为 1。接下来是setTimeout的用武之地。

setTimeout 根据定义,将在 500 毫秒间隔后运行脚本。由于函数 timeCount 是在循环中调用的,因此它将在连续循环中运行该函数,每次运行的间隔为 0.5 秒。它将以每 500 毫秒 1 的增量计算并显示 i 的值。