multithreading - Javascript thread-handling and race-conditions - Stack Overflow

admin管理员组

文章数量:1314574

Lets asume I have a code like the following:

var shared = 100;
function workWithIt(){
    shared += 100;
}

setTimeout(workWithIt, 500);
setTimeout(workWithIt, 500);

Ideally, this piece of code should add 200 to the variable shared, which is 300 afterwards.

But, as I know from c, there can be some implications, if the operation += is split into multiple mands.

Lets say, that this is the execution-order of the function:

setTimeout() --> create Thread A
setTimeout() --> create Thread B
wait 500ms

      **Thread A**              |        **Thread B**
--------------------------------+---------------------------------
var tmpA = shared;  //100       |
                                |   var tmpB = shared; //100
                                |   tmpB = tmpB+100;   //tmpB=200
                                |   shared = tmpB;
tmpA = tmpA+100;    //tmpA=200  |
shared = tmpA;                  |

In this case, shared has now the value 200.

This can happen in many programming-languages like c, c++, java, c#, ... - but can it also happen in Javascript?

Or more generally speaking: How does Javascript handle its threads, when does it switch between threads, and are there built-in methods, that can be used for handling race-conditions?

Lets asume I have a code like the following:

var shared = 100;
function workWithIt(){
    shared += 100;
}

setTimeout(workWithIt, 500);
setTimeout(workWithIt, 500);

Ideally, this piece of code should add 200 to the variable shared, which is 300 afterwards.

But, as I know from c, there can be some implications, if the operation += is split into multiple mands.

Lets say, that this is the execution-order of the function:

setTimeout() --> create Thread A
setTimeout() --> create Thread B
wait 500ms

      **Thread A**              |        **Thread B**
--------------------------------+---------------------------------
var tmpA = shared;  //100       |
                                |   var tmpB = shared; //100
                                |   tmpB = tmpB+100;   //tmpB=200
                                |   shared = tmpB;
tmpA = tmpA+100;    //tmpA=200  |
shared = tmpA;                  |

In this case, shared has now the value 200.

This can happen in many programming-languages like c, c++, java, c#, ... - but can it also happen in Javascript?

Or more generally speaking: How does Javascript handle its threads, when does it switch between threads, and are there built-in methods, that can be used for handling race-conditions?

• javascript
• multithreading
• synchronization
• thread-safety
• race-condition

Share Improve this question Follow edited Jan 30, 2014 at 22:26 noseratio 61.7k3636 gold badges223223 silver badges500500 bronze badges asked Jan 30, 2014 at 21:02 majamaja 18.1k1818 gold badges8484 silver badges127127 bronze badges 6

• 3 JavaScript is single-threaded. – Pointy Commented Jan 30, 2014 at 21:04
• But you can have several execution-lines in parallel, and the browser switches between them. Even if it happens within the same thread, the results are the same. – maja Commented Jan 30, 2014 at 21:06
• 2 It's not "switching between them." Timers are like event generators, and the timer function is run to pletion before the next event (or timer) is processed. In your example, one function or the other will always run to pletion before the other starts. – Pointy Commented Jan 30, 2014 at 21:07
• 1 Yes. The alert() function itself is an exception: while waiting for the user to dismiss the alert, browsers allow some event handlers to run (I can't recall exactly which ones). But running JavaScript code doesn't get interrupted by the browser - that's why pute-intensive code (or an infinite loop) can cause the browser to pop up a dialog asking if the user wants to terminate the running code. – Pointy Commented Jan 30, 2014 at 21:24
• 1 Here is another good StackOverflow question. – Pointy Commented Jan 30, 2014 at 21:26

 |  Show 1 more ment

2 Answers 2

Sorted by: Reset to default 6

JavaScript code has a single explicit thread of execution. The scenario you've described will never take place in JavaScript. A timer callback is just another kind of event, and all events are serialized for sequential execution by the same core event loop of the browser UI thread.

Thus, two timer events cannot be processed concurrently, one callback will happen after another.

You still can have real concurrency in JavaScript by means of Web Workers. However, a web worker cannot share any objects with another web worker or the main thread. Instead, web workers serialize their state objects with JSON, and exchange messages with postMessage. So, your scenario is still impossible.

However, consider another case:

var shared = 100;

function workWithIt1(){
    shared += 100;
}

function workWithIt2(){
    shared = shared/2;
}

setTimeout(workWithIt1, 500);
setTimeout(workWithIt2, 500);

Will shared be 150 or 100, once both timeouts have been fired? It probably will be 100, because the workWithIt1 timeout was queued first. However, I would not rely upon this fact though, because both timers have the same timeout value of 500, and implementation of timers might be browser-specific. You may want to avoid side effects like that in your code.

AFAIK, there is no multithreading in JS. I changed your example a bit to try to understand what you mean.

var shared = 100;
function workWithIt(a){
    shared += a||100;
    console.log(shared);
}

setTimeout(function(){workWithIt(5);}, 500);
setTimeout(function(){workWithIt(10);}, 500);
console.log(shared);

With this code, the result is always (in my testing):

100
105
110

This indicates to me that there is no chaotic or random or even interesting process here. There are certain possibilities to create racing conditions with JS in the browser, but your timing example is not that. Racing requires only a breakdown in predictability of execution order. Maybe if you change your delay from 500 to Math.floor(500 * Math.random()) you would have a racing condition.

本文标签： multithreadingJavascript threadhandling and raceconditionsStack Overflow