title: setTimeout blocks eventloop
body: <p>I was reading an article that stated that to create a nonblocking/asynchronous function, usage of <code>setTimeout</code> is crucial. And I thought that the function that is passed to <code>setTimeout</code> runs in the background. Then I read in another article that <code>setTimeout</code> does block the event loop when function is fired. So, I tried the following function to test.</p>
  
  <pre><code>function getit(cb) {
  var i = 0;
   setTimeout(function() {
    while (i &lt; 200000) { i++; console.log(i); }
    cb(i); 
   } , 1000); 
   console.log(i); 
  }
  
  getit(function(message) { console.log(message); });
  </code></pre>
  
  <p>Apparently, when 1000ms passes and it is time to execute the function, the thread is blocked and my browser freezes. My question is, if asynchronous code is not supposed to block the thread, how is that possible when the function is being executed when time elapses and not in the background? It seems like this is just a delay, but eventually, the function is going to be executed line by line and block the loop anyway. Is there something I'm missing or confused about?</p>