Welcome to ShenZhenJia Knowledge Sharing Community for programmer and developer-Open, Learning and Share
menu search
person
Welcome To Ask or Share your Answers For Others

Categories

I'm trying to understand this example:

HTML (main code):

   <html>  
     <title>Test threads fibonacci</title>  
     <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 + "
");  
       };  

       worker.onerror = function(error) {  
         dump("Worker error: " + error.message + "
");  
         throw error;  
       };  

       worker.postMessage("5");  

     </script>  
     </body>  
   </html> 

Javascript (worker code):

   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);  
     }  
  };  

I have the following questions:

  • When exactly the worker code starts to run ? Immediately after the execution of var worker = new Worker("fibonacci.js"); ?

  • Is that true that onmessage = function(event) { ... } assignment in the worker code will be executed before worker.postMessage("5"); in the main code ?

  • Can worker code access global variables that are defined in the main code (like worker)?

  • Can main code access global variables that are defined in the worker code (like results)?

  • It seems to me that worker.onmessage = function(event) {...} in the main code has the same meaning like onmessage = function(event) {...} in the worker code (which is onmessage event handler of the worker). Where am I wrong ? What is the difference between them ?

  • What this code should actually do ? When I run it here it just prints "5". Is that what it is supposed to do, or I'm missing something ?

Thanks a lot !

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
thumb_up_alt 0 like thumb_down_alt 0 dislike
190 views
Welcome To Ask or Share your Answers For Others

1 Answer

Check out HTML5 Rocks: The Basics of Web Workers for general tutorial.

  • Workers will start as soon as you call the postMessage method of the worker.
  • the function bound to worker's onmessage in the main code will work when the worker calls postMessage.
  • global variables are not shared between main and worker threads. The only way to pass data is through messaging via postMessage.
  • as you suspected, the onmessage on both worker and main code has the same meaning. It is an event handler for when the thread receives a message event. You can even use addEventListener instead, catching message event:

Main Code:

function showResult(event) {  
   document.getElementById("result").textContent = event.data;  
   dump("Got: " + event.data + "
");  
}
var worker = new Worker("fibonacci.js");
worker.addEventListener('message', showResult, false);

Worker code:

addEventListener('message', resultReceiver, false);

The fibonacci example you took is a recursive worker example. If not using workers, it would be something like this:

function fibonacci(n) {
    if (n == 0 || n == 1) return n;
    return fibonacci(n-1) + fibonacci(n-2);
}

var result = fibonacci(5);
dump("Got: " + result + "
");

(oh no, I'm not going to do a stackless for you. You write it yourself!)


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
thumb_up_alt 0 like thumb_down_alt 0 dislike
Welcome to ShenZhenJia Knowledge Sharing Community for programmer and developer-Open, Learning and Share
...