# javascript回調函數詳解 在高級語言層出不窮的年代, 各個語言都號稱有著一切皆為對象的自豪說法, 而 js 作為一門腳本語言卻相對于java等傳統面向對象語言有很大的不同之處, 除了 js 詭異的繼承體系之外, 最令人著迷的一個特性就是回調函數, 當然也有很多人對他詬病, 筆者認為 回調函數 和 異步 是js語言特性的兩大最為突出的店, 當然正如所有優點需要滿足自我的需求, 這個世界沒有銀彈, 比如大量的使用回調函數將會使你的代碼冗余, 錯亂影響代碼人的視覺與思維體驗. 本文是自己對學習回調函數的的體會, 難免不完善甚至錯誤, 原諒我的無知, 我愿虛心學習, 完善自己. javascript最獨特的就是 函數 作為一等公民, 我更愿意將 js 稱為一切皆為 變量 的一門高級語言, 函數也是一種變量可以成為其他函數的參數, 我們喜歡在js中稱之為回調函數, 另外js中的匿名函數可以作為函數參數使得回調函數的寫法如魚得水. ps. 回調函數與 c 語言中的函數指針類似---指針指針指針!!!重要的事情說三遍 先來看一下回調函數的定義 In computer programming, a callback is a piece of executable code that is passed as an argument to other code, which is expected to call back (execute) the argument at some convenient time 回調函數是一段可執行的代碼段，它作為一個參數傳遞給其他的代碼，其作用是在需要的時候方便調用這段（回調函數）代碼。 ## 回調函數 123456789101112function addSqua(num1, num2, callback){ var sum = num1 + num2; return callback(sum);} function squa(num){ return num\*num;} let num = addSqua(1, 2, squa); console.log(num);//=>9 **匿名回調函數** 將匿名函數直接作為函數參數傳遞給函數, 這也是我們編程一般采用的 123456789function addSqua(num1, num2, callback){ var sum = num1 + num2; return callback(sum);}let num = addSqua(1, 2, function squa(num){ return num\*num;}); console.log(num);//=9 **模仿數組中的every方法** 在Array.prototype中添加類似與every一樣的方法 123456789101112131415161718192021Array.prototype.myEvery = function (callback) { if (typeof callback === 'function') { for (let i = 0; i < this.length; i++) { if (callback(this\[i\])) { return false; } } return true; } return true;} let op = \[3, 6, 'every', 9,'each'\];op.myEvery(function (value) { console.log(value);})// 3// 6// 'every'// 9// 'each' ## **回調函數特點** 1. 不會立刻執行, 正如定義中給出的一樣回調函數作為代碼片段可以根據需要在其特定條件下執行, 回調函數作為參數傳遞給一個函數的時候，傳遞的只是函數的定義并不會立即執行。 2. this，ES6推出了箭頭函數, 箭頭函數的推出需要在寫回調函數的時候格外注意, this 是指向所在函數的上下文對象, 如果在在ES6采用箭頭函數則需要注意 this使用, 箭頭函數中this并沒有上下文關系直說, 有興趣的可以查看ES6 阮一峰, 再次奉上傳送門 回調函數的優點和使用場景是個閉包 回調函數是閉包的簡單使用，也就是說它能訪問到其外層定義的變量。 ## 回調函數之美 - DRY，避免重復代碼。 - 可以將通用的邏輯抽象。 - 業務邏輯分離 (it's so beautiful ^-^ ^-^) - 提高代碼可維護性和可讀性。 - 加強代碼可讀性。 - 分離專職的函數。 js回調函數的偉大之處是其他傳統語言所沒有的, 它可以實現業務邏輯分離, 相當于暴露給外界一個接口, 這一點像極了前后端分離架構中的 API 接口設計理念