關于js的回調、同步回調、異步回調

BakerJ 發布于2019-08-20 16:30 / 2172人閱讀

摘要：回調定義剛開始學習時，對回調函數的理解僅僅停留在知道定義階段。什么是回調函數就是將一個函數作為參數傳遞給另一個函數，作為參數的這個函數就是回調函數。參考文章詳解回調函數以為例解讀異步回調和異步編程的種方法阮一峰的網絡日志

回調定義

剛開始學習javascript時，對回調函數的理解僅僅停留在知道定義階段。什么是回調函數？就是將一個函數作為參數傳遞給另一個函數，作為參數的這個函數就是回調函數。至于為什么要用到回調函數？回調函數有什么作用？當時對這些一無所知！最近學習node.js涉及到了大量的異步編程，很多地方都需要用到回調函數，所以這兩天深入了解了JavaScript的回調函數，下面是我對回調函數的理解。

函數也是對象

想要弄明白js回調函數，首先要清楚函數的規則，在javascript中函數是一個對象，準確的來說函數是用function()構造函數創建的一個function對象，因此我們可以將函數存儲在變量中，當然也就可以將存儲在變量中的函數作為一個參數傳遞給另一個函數，這就是回調函數。
舉個例子：

var callback = function(arg3) {
    console.log("callback Totle is:" + arg3)
  }

function fn(arg1, arg2, cb) {
  var Total = arg1 + arg2;
  cb(Total);
  console.log("mainFunction Totle is:" + Total)
}

fn(2, 2, callback)   // 調用fn()函數，并傳入2, 2, callback作為參數

上面例子中我們將一個匿名函數賦值給變量callback，同時將callback作為參數傳遞給了fn()函數，這時在函數fn()中callback就是回調函數。

同步回調和異步回調

上面的代碼執行結果為：

callback Totle is:4
mainFunction Totle is:4

不對啊！回調函數不是應該在主函數的最后執行嗎？
對，很多介紹回調函數的例子講到這里是就完了，異步回調函數的確是應該在函數的最后執行，不過上面的例子是一個同步回調函數，函數的執行順序依然自上而下順序執行。那么什么是異步回調呢？我們又怎么實現異步回調呢？下面我們舉兩個例子來說明：

示例1：

function f2() {

    console.log("f2 finished") 
}

function f1(cb) {

    setTimeout(cb,1000)        //用setTimeout()模擬耗時操作
    console.log("f1 finished")
}

f1(f2);    //得到的結果是 f1 finished ，f2 finished

這里我們用setTimeout()來模擬耗時操作的前提是js中的setTimeout()函數支持異步處理，所以我們得到的結果是 f1 finished ，f2 finished

示例2：

var fs = require("fs");

fs.readFile("input.txt","utf-8", function (err, data) {
    if (err) return console.error(err);
    console.log(data.toString());
});

console.log("程序執行結束!");

程序執行的結果是:

$ node app
程序執行結束!
我們來測試一下異步回調函數

上面例子中我們先創建了一個文件input.txt，里面的內容是:"我們來測試一下異步回調函數"
如果按照同步的思維，程序應該執行fs.readFile，直到文件讀完之后才執行后面的console.log("程序執行結束!"); 然而node中的fs.readFile是支持異步處理的，因此程序執行到這兒的時候并不會阻塞，而是繼續向后執行，當文件讀取完畢之后再自動調用傳入的匿名回調函數，因此出現了上面的結果。

參考文章：
詳解回調函數——以JS為例解讀異步、回調和EventLoop http://blog.csdn.net/tywinsta...
Javascript異步編程的4種方法 - 阮一峰的網絡日志http://www.ruanyifeng.com/blo...

云服務器 GPU云服務器同步回調和異步回調 js 異步回調返回數據有關于回調的問題異步回調

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/82961.html

同步與異步、異步與回調

摘要：同步與異步以上為同步代碼，函數必須等函數執行完畢后才能執行。異步回調產生的結果就是，函數的調用并不直接返回結果，而往往是交給回調函數進行異步處理。同步與異步： function a(){} function b(){} a(); b(); 以上為同步代碼，函數b必須等函數a執行完畢后才能執行。 function a(){ ...

dinfer 2019-08-21 10:45 評論0 收藏0
JS基礎——異步回調

摘要：回調大多出現在請求，用于處理收到的請求結果。回調函數和異步一開始我被回調和異步有點搞暈了。異步編程的實現就我目前知道兩種回調函數和事件監聽，其實看了阮神的異步編程的文章和下面的評論之后得出的理解。為了不影響的執行，我們可以把寫成的回調函數。前言一個剛入前端的小菜，雖然以前看到過關于回調的文章，但是呢，理解起來有點費勁啊。當時的腦海里就一個概念。回調：大多出現在Ajax請求，用于處...

tianhang 2019-08-22 10:40 評論0 收藏0
由setTimeout深入JavaScript執行環境的異步機制

摘要：圖片轉引自的演講和兩個定時器中回調的執行邏輯便是典型的機制。異步編程關于異步編程我的理解是，在執行環境所提供的異步機制之上，在應用編碼層面上實現整體流程控制的異步風格。問題背景在一次開發任務中，需要實現如下一個餅狀圖動畫，基于canvas進行繪圖，但由于對于JS運行環境中異步機制的不了解，所以遇到了一個棘手的問題，始終無法解決，之后在與同事交流之后才恍然大悟。問題的根節在于經典的J...

codeGoogle 2019-08-21 18:29 評論0 收藏0
JS異步編程之callback

摘要：而異步則是相反，調用在發出之后，這個調用就直接返回了，所以沒有返回結果而是在調用發出后，被調用者通過狀態通知來通知調用者，或通過回調函數處理這個調用。總結回調函數是異步編程中的基石，但同時也存在很多問題，不太適合人類自然語言的線性思維習慣。為什么 JS 是單線程？眾所周知，Javascript 語言的執行環境是單線程（single thread）。所謂單線程，就是指一次只能完成一...

superw 2019-08-23 15:15 評論0 收藏0
解析關于JavaScript事件循環同步任務與異步任務

　　學習一門知識，有些內容必須要提前明白，比如在學習js中同步異步的問題前，需要明白，js是單線程的，為什么它得是單線程的呢？現在先從它應用的場景來說，就是用來讓用戶與頁面進行交互的吧。假如有js是多線程的，那在這個線程里面，用戶點擊某個按鈕會增加一個DOM節點，在另一個線程里面，用戶點擊這個按鈕又會刪除一個DOM節點，那么此時js就不知道該聽誰的了。這就是為什么會出現同步異步。假設沒有異步，那么...

3403771864 2022-10-19 22:10 評論0 收藏0