點點筆記

Callback function : 這個函式只會在滿足了某個條件才會被動地去執行，我們就可以說這是一個 Callback function。

function chargeMoney(){
	console.log(123);
}

function active(data, callback) {
    var s ="12"; 
    callback(); 
    var d ="12"; 
    callback();
}

active({}, chargeMoney.bind(null, 100));
	 

會將「後續要做的事情」透過參數的方式，帶給原本的函式，以確保在原本的函式執行後才去呼叫：

var funcA = function(callback){
  var i = Math.random() + 1;

  window.setTimeout(function(){
    console.log('function A');

    // 如果 callback 是個函式就呼叫它
    if( typeof callback === 'function' ){
      callback();
    }

  }, i * 1000);
};

var funcB = function(){
  var i = Math.random() + 1;

  window.setTimeout(function(){
    console.log('function B');
  }, i * 1000);
};

為了確保先執行 funcA 再執行 funcB, 呼叫 funcA( ) 的時候，將 funcB 作為參數帶入 funcA( funcB );

如果要，確保三個動作都完成之後，才繼續執行後面的程式呢？

------->最直覺的方式是新增一個變數來管理狀態：

var result = [];
var step = 3;

// 假設 funcA、funcB、funcC 分別代表「切青菜、切番茄、擺盤」
function funcA(){
  window.setTimeout(function(){
    result.push('A');
    console.log('A');

    if( result.length === step ){
      funcD();
    }

  }, (Math.random() + 1) * 1000);
}

function funcB(){
  window.setTimeout(function(){
    result.push('B');
    console.log('B');

    if( result.length === step ){
      funcD();
    }
  }, (Math.random() + 1) * 1000);
}

function funcC(){
  window.setTimeout(function(){
    result.push('C');
    console.log('C');

    if( result.length === step ){
      funcD();
    }
  }, (Math.random() + 1) * 1000);
}

function funcD(){
  console.log('上菜！');
  result = [];
}

funcA();
funcB();
funcC();

setTimeout 會等待亂數時間的關係，我們無法得知誰先誰後。 但可以確定的是，當這三個函式執行的時候就會去檢查 result.length === step ，如果成立，就表示三個任務都已經完成，那麼就可以再去呼叫 funcD 執行後續的事情。

 

 

 

引用：https://goo.gl/wzUrgY

https://goo.gl/UzTfa9