Edit in JSFiddle

<body>
<h1 id="text"></h1>
<script>
function asyncTask(callback){
  var req = new XMLHttpRequest();
  req.open('GET', 'https://api.flickr.com/services/rest/?method=flickr.photos.getRecent&api_key=46a247f7ad0611a92fa3bf67a931c5db&format=json&nojsoncallback=1', true);
  req.onreadystatechange = function(){
    if (this.readyState == 4) {
      callback(); // 전송이 완료되면 콜백 실행
    }
  }

  // req의 send() { [native code] } 함수는 백그라운드 쓰레드에서 네트워킹 작업을 합니다.
  // 즉, 이 코드는 메인 쓰레드를 블록킹 하지 않습니다.
  req.send();
}

var h1 = document.getElementById('text');
h1.innerHTML += 'One<br>';
asyncTask(function(){ // 이 콜백은 비동기 작업이 끝난 이후 다시 메인 쓰레드에서 호출됩니다.
  h1.innerHTML += 'Two<br>';
});
h1.innerHTML += 'Three<br>';
</script>
</body>