目的 : 認識 callback function 的定義及用法
處理說明: JavaScript 是一個「非同步」的語言，
當我們執行程式時，
for 迴圈並不會等待處理作業(statement)結束後才繼續，而是在執行階段就一口氣將statement執行完。
一. callback function 的定義: call function , 只有滿足某個條件(event 發生時)才會被執行
Callback function 跟一般的函式沒什麼不同， 差別在於被呼叫執行的時機
Office.addEventListener( '電話響', function(){ /* 接電話 */ }, false);Callback function就是「把函式當作另一個函式的參數，透過另一個函式來呼叫它」
Ex1> window.setTimeout( function(){ ... }, 1000);
Ex2>
var handler = function() { /* 接電話 */ };Office.addEventListener( '電話響', handler, false);
Ex3:
var funcA = function(){console.log('function A');};var funcB = function(){console.log('function B');};
funcA();
funcB();
--> 先印 function A , 再印 function B
Ex4:
var funcA=function {
window.setTimeout(function(){ console.log('function A'); },
window.setTimeout(function(){ console.log('function A'); },
Math.random()*1000);
}
}
var funcB=function {
window.setTimeout(function(){console.log('function B'); },
Math.random()*1000);
}
window.setTimeout(function(){console.log('function B'); },
Math.random()*1000);
}
funcA();
funcB();
--> 不確定 function A / function B 先印
Ex5: 確保 function A 先印, 再印 function B
var funcA=function(par_callback) {
window.setTimeout(function(){
window.setTimeout(function(){
console.log('function A');
if (typeof par_callback="function"){
par_callback();
}
},
Math.random()*1000);
};
var funcB=function(){
window.setTimeout(function(){
console.log('function B');
},
Math.random()*1000);
};
funcA(funcB); --> 無論
funcA 在執行的時候要等多久， funcB 都會等到 console.log('function A'); 之後才執行。Ex6 : 在五秒鐘之內，每秒鐘依序透過
console.log 印出： 0 1 2 3 4 for (var i=0;i<5;i++){
window.setTimeout(function(){ console.log(i); }
,1000*i);
};
//執行結果 : 5 5 5 5 5
--> JavaScript 是一個「非同步」的語言,執行程式時，
for迴圈並不會等待處理作業(statement , window.setTimeout )結束後才繼續， 而是在執行階段就一口氣將statement執行完。
--> 切分變數(i)有效範圍的最小單位是 "function"--> 因為函式未宣告變數 i , 所以每次執行 console.log(i); 的 i 變數是去函式「外層」取得
因 function() 內未宣告 var i, 所以會在函式外層取得 (此時for迴圈已跑完 i=5) , 所以印出 5
因 function() 內未宣告 var i, 所以會在函式外層取得 (此時for迴圈已跑完 i=5) , 所以印出 5
for(var i =0; i<5;i++) --> 宣告 i 為全域變數
二.IIFE(Immediately Invoked Function Expression, IIFE)
一般宣告方式: doit(x);
IIFE宣告方式: 函式宣告當下即呼叫 , 傳入參數 i , 即傳入當時的 i 值(0,1,2,3,4,5)
(function doit(x){ console.log(x);} ) (i)
--> for (var i=0;i<5;i++)
(function doit(x){ console.log(x);} ) (i);
