Why can't Web Worker call a function directly?

Question

We can use the web worker in HTML5 like this:

var worker = new Worker('worker.js'); 

but why can't we call a function like this?

var worker = new Worker(function(){     //do something }); 

Answer 1

This is the way web workers are designed. They must have their own external JS file and their own environment initialized by that file. They cannot share an environment with your regular global JS space for multi-threading conflict reasons.

One reason that web workers are not allowed direct access to your global variables is that it would require thread synchronization between the two environments which is not something that is available (and it would seriously complicate things). When web workers have their own separate global variables, they cannot mess with the main JS thread except through the messaging queue which is properly synchronized with the main JS thread.

Perhaps someday, more advanced JS programmers will be able to use traditional thread synchronization techniques to share access to common variables, but for now all communication between the two threads must go through the message queue and the web worker cannot have access to the main Javascript thread's environment.

Answer 2

This question has been asked before, but for some reason, the OP decided to delete it.
I repost my answer, in case one needs a method to create a Web worker from a function.

---

In this post, three ways were shown to create a Web worker from an arbitrary string. In this answer, I'm using the third method, since it's supported in all environments.

A helper file is needed:

// Worker-helper.js self.onmessage = function(e) {     self.onmessage = null; // Clean-up     eval(e.data); }; 

In your actual Worker, this helper file is used as follows:

// Create a Web Worker from a function, which fully runs in the scope of a new //    Worker function spawnWorker(func) {     // Stringify the code. Example:  (function(){/*logic*/}).call(self);     var code = '(' + func + ').call(self);';     var worker = new Worker('Worker-helper.js');     // Initialise worker     worker.postMessage(code);     return worker; }  var worker = spawnWorker(function() {     // This function runs in the context of a separate Worker     self.onmessage = function(e) {         // Example: Throw any messages back         self.postMessage(e.data);     };     // etc.. }); worker.onmessage = function() {     // logic ... }; worker.postMessage('Example'); 

Note that the scopes are strictly separated. Variables can only be passed and forth using worker.postMessage and worker.onmessage. All messages are structured clones.