javascript高級------回調函數

函數類型中,比較常用的是匿名函數和回調函數,一般來說,回調函數是以匿名函數的形式來進行表現的。回調函數在事件監聽,異步的執行等,都會用到的是回調函數的作用。
回調函數的概念
第一:在js中,函數是個特殊的對象,確實是Function函數的創建的實例,我們可以通過new關鍵字來進行創建函數,比如:
var fn = new Function(''num1'',"num2","return (num1 + num2);");
這樣,也就是可以創建函數了。
傳統函數是以傳參數的形式,來輸入數據,并使用返回語句來進行獲取返回值。事實上,在函數的末尾使用return 來返回函數加工好的數據,來作為結束點。函數的傳參是作為函數的開始點,這樣,一個開始點和一個結束點,來形成一一對應的映射關系。其實函數,就是輸入和輸出實現過程的映射關系。
假設,我們在定義函數時,出現函數的執行結果過程比較長,我們是等待函數的執行呢?還是用異步來進行回調執行結果呢?所以,使用回調函數來進行異步的處理就顯得是非常重要的了。比如:我們的Ajax請求的回調函數,事件監聽的函數,還是我們自定義的函數傳參的回調函數都是運用這個機制。
后續子的邏輯依賴于主干邏輯行為的執行結果。等主干邏輯行為執行完畢,在主邏輯的函數的參數中,是回調函數的執行邏輯代碼。如果,一個對象的行為有后續行為的話,我們就可以傳入回調函數作為參數,來進行執行后續的邏輯。
第二 : 我們要注意的是,回調函數是作為主邏輯的參數是可傳可不傳的,所以,我們要進行健壯性處理,也就是利用邏輯與來進行健壯性的構建。以防止不傳回調函數的情況下,出現代碼執行錯誤。
我們在生活中,也會有這樣的執行順序的。我們不確定的是,主邏輯的執行結果,是什么,就先傳入一個回調函數,放到回調函數的下面,來進行執行。在主邏輯中,我們可以傳入匿名函數來進行回調,這樣,就比較滿足我們主邏輯的執行結果后的靈活的執行了。這個是回調函數的主要作用。比較靈活的執行,依賴于主邏輯的執行結果。
···
function fn (num,callback) {
for (var i = 0;i < num; i++) {
if ( i > 100) {
callback && callback();
}
}
};
···

 fn (101,function () {
        console.log('想玩什么就玩什么');
});

2: 異步的執行過程,我們需要回調函數來進行保存我們用ajax請求下來是值。還有新語法的Promise/then,我們都可以用這些來進行使用回調函數。

仿ES6 Promise
function Promise () {
this.takes = [];
this.error = function () {
console.log('數據獲取失敗');
};

 };
3 : 通過call方法,來進行Promise構造函數添加方法.
 (function () {
    this.success = function (result) {
        this.complate('success',result);
    };
    this.error = function (result) {
        this.complate('error',result);
    };
    this.complate = function (type,result) {
        if (this.takes.length > 0) {
            this.takes.shift()[type](result);
        };

     };
    this.then = function (successHanle,errorHanle) {
        this.takes.push({
            success : successHanle,
            error : errorHanle
        });
        return this;
    };

}).call(Promise.prototype);
// test實例
  var promise = new Promise();
  function start () {
       在setTimeout延遲定時器中,我們傳入一個回調函數。我們可以通過
     setTimeout來延遲其執行函數,進行模擬ajax請求。
     setTimeout (function () {
          promise.success('數據請求成功了');
             },1000);
             return promise;        
        };
   var callback1 = function (re) {
      console.log(re);
      promise.error('數據請求失敗了');
   };
   var callback2 = function (re) {
       console.log(re);
   }
4:執行Promise對象
start().then(callback1,promise.err).then(callback2,promise.err);

這個是回調函數的執行過程,還有事件監聽,一旦觸發事件,就可以通過回調函數進行事件邏輯的處理或者是操作。這個是比較常見的回調函數的使用場景。事件監聽是我們要經常用的是回調函數使用場景。
6 : 在項目中,我們也經常用到的翻頁效果,也經常會回調函數的執行邏輯。

1 : function myFn (num1,num2,callback) {
num1 > num2 ? num1 : num2;
// 執行完比較大小的時候,觸發回調函數。
callback && callback ();
};
2 : function myFn2 (max,min,callback) {
var num = Math.ceil( Math.random()* (max - min) + min);
callback(num);
}
// 調用函數的執行
myFn2(12,4,function (num2) {
console.log(num2);
});
這些都是我們自定義的回調函數的執行。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 229,001評論 6 537
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 98,786評論 3 423
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 176,986評論 0 381
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 63,204評論 1 315
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 71,964評論 6 410
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 55,354評論 1 324
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,410評論 3 444
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,554評論 0 289
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 49,106評論 1 335
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 40,918評論 3 356
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 43,093評論 1 371
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,648評論 5 362
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,342評論 3 347
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,755評論 0 28
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 36,009評論 1 289
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 51,839評論 3 395
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 48,107評論 2 375

推薦閱讀更多精彩內容

  • 本文檔內容參考 《JavaScript 闖關記》之函數 函數是一段代碼,它只定義一次,但可以被執行或調用任意次。在...
    穿越人海遇見你閱讀 1,009評論 0 1
  • 工廠模式類似于現實生活中的工廠可以產生大量相似的商品,去做同樣的事情,實現同樣的效果;這時候需要使用工廠模式。簡單...
    舟漁行舟閱讀 7,799評論 2 17
  • 1.JQuery 基礎 改變web開發人員創造搞交互性界面的方式。設計者無需花費時間糾纏JS復雜的高級特性。 1....
    LaBaby_閱讀 1,193評論 0 1
  • 第一章: JS簡介 從當初簡單的語言,變成了現在能夠處理復雜計算和交互,擁有閉包、匿名函數, 甚至元編程等...
    LaBaby_閱讀 1,685評論 0 6
  • Address:https://www.zybuluo.com/XiangZhou/note/208532 Exp...
    天蠍蒗漫閱讀 11,354評論 2 55