1. 程式人生 > >javascript利用回撥函式解決非同步困擾

javascript利用回撥函式解決非同步困擾

雖然已經存在promise,StratifiedJS等工具用來解決回撥地獄,但是講真,我覺得他們也並沒有讓程式碼的可讀性大大增強,而且在回撥函式的巢狀次數有限的情況下也不至於成為一個“地獄”,所以筆者還是老老實實的繼續啃這塊js裡的板磚——利用回撥函式解決javascript非同步困擾。

但願大家可以從下面的這個例子得到些有用的資訊:

fun(function(data){ //data:num1
 fun1(num1,function(data){ //data:num2
  fun2(num2,function(data){ //data:num3
    fun3(num3);
  });
 });
});


function fun(callback)
{
  var num1 = 1;
  console.log("begins!");
  callback(num1);
}
function fun1(num1,callback)
{
  var num2 = 2;
  setTimeout(function(){
    console.log(num1);
    callback(num2);
  },3000);
}
function fun2(num2,callback)
{
  var num3 = 3;
  setTimeout(function(){
    console.log(num2);
    callback(num3);
  },2000);
}
function fun3(num3)
{
  setTimeout(function(){
    console.log(num3);
  },1000);
}

輸出結果如下圖所示:


可以看出函式的執行順序為fun1---->fun2---->fun3,是按照我們回撥函式巢狀,由外層向內層執行,達到了某種意義上的順序執行。