JS 對於回呼函數的理解，和常見的使用情境應用，使用注意點

標籤：style   http   io   os   使用   java   ar   for   資料   

 

很經常我們會遇到這樣一種情況：

例如，你需要和其他人合作，別人提供資料，而你不需要關注別人擷取或者構建資料的方式方法。

你只要對這個拿到的資料進行操作。

這樣，就相當於我們提供一個外在的函數，別人調用這個函數，返回相應的資料。

 

例如：

 

?

12345678

function (num , numFun) {if(num < 10){//do sth}else {//do sthnumFun();}}

 

在num的判斷之後執行NumFun的函數。

 

所謂的回呼函數，可以這樣理解，它是為了實現這樣一個目的：

draw方法是一個繪圖的函數

現在我們調用這個draw方法，希望在圖形繪製完成之後，我們能夠進行相應的操作，為了保證這個操作是在繪圖完成之後調用的。

我們就採取這樣一種方法，將fun作為參數傳遞進draw，然後再draw函數執行完成之後，調用這個傳遞的fun方法

 

 

?

1234567891011121314151617

function draw(beforeDraw, afterDraw) {beforeDraw();//繪圖//dosth afterDraw();} //別人調用draw(function(){alert(‘繪圖之前執行‘);//繪圖之前,do sth},function(){alert(‘繪圖之後執行‘);//繪圖之後，do sth})

 

當然利用這種思想，我們可以在很多地方有很巧妙的使用:

比如之前舉得例子

你只關注資料的傳回值，不關注別人調用這個方法是怎麼操作的。

方法1：

就可以利用回呼函數的思想，定義方法傳入的參數為函數，別人調用是，在函數參數中執行相應的操作，然後返回你所需要的值：

 

?

12345678

var drawBase = {init : function (getdata){  var mydata = getdata(); $(‘#testID‘).bind(‘click‘, function(e){  //利用mydata進行繪圖操作})},}

 

//別人在調用你這個函數時候，傳入的參數為函數，函數中進行操作後返回相應的值

 

 

?

12345

drawBase.init(function () {//do sth一系列操作之後return data;})

方法2、

 

你也可以，先定義一個空方法，然後別人再去重寫這個方法，進行一系列的操作之後，返回相應的資料

然後我們使用時候，就可以拿到這個返回的資料了：

Exp：

 

?

123456789

var drawBase = {getdata = { },init : function () {$(‘testID‘).bind(‘click‘, function () {  var data = drawBase.getdata();//使用data進行你所需要的操作})}}

 

//別人調用時候，就需要重寫這個方法

 

?

1234	drawBase.getData = function () {   //一系列操作，得到data， return data;}

 

這兩種方法可以這樣理解：

方法一，綁定事件和操作，是在別人調用時候才做的，因此那個時候getdata()的方法是已知的可以直接綁定

方法二，綁定的事件和操作，是之前進行的，此時不知道getdata()的方法，因而給定一個空的方法定義，在別人調用重寫後，就可以拿到相應的資料

 

這個是我個人的一些看法~

 

Exp:

 

?

12345678

var stu={    init : function(callback){        //TODO ...        if(callback && (callback  instanceof Function){              callback(‘init...‘);//回調        }    }};

別人調用，傳入函數參數：?

123	stu.init(function(){     //這就是回調了...});

 

加油！

 

JS 對於回呼函數的理解，和常見的使用情境應用，使用注意點