Angular源碼解讀publishExternalAPI函數

閱讀我的原文
function publishExternalAPI(angular){}
publishExternalAPI就是將一些通用的方法掛載到全局變量angular上,然后我們就可以以API的形式進行調用
函數首先傳入一個angular的全局變量,下面將會遇到在前面定義的好的一個extend函數

function extend(dst) {
        var h = dst.$$hashKey;
        return forEach(arguments, function(obj) {
            obj !== dst && forEach(obj, function(value, key) {
                dst[key] = value
            })
        }), setHashKey(dst, h), dst
    }

這里的方法就是將某些通用的方法掛到一個對象上面,extend傳入和返回都是dst形參對象,里面經歷了兩個forEach,forEach也是angular前面定義好的函數,extend根據傳入的arguments個數進行判斷,dst是需要掛載的對象,arguments中除了dst外都是需要被掛載到dst中的對象
obj !== dst && forEach(obj, function(value, key) {})
上面這句就是將arguments中的dst對象排除出去,然后對dst進行對象掛載
然后就轉化成

angular['boostrap'] = boostrap;
angular['copy'] = copy;
angular['extend'] = extend;
//...省略若干個通用的方法

上面就不一一列出所有方法,當然當我們對加載了angular.js的頁面進入控制臺進行打印就會很清晰的看出這里的全部方法
console.log(angular);
如圖所示

image
image

這些通用的工具函數在實際的項目中會經常使用到,挺方便的例如forEach,toJson和fromJson這些常用函數
當然就如上面的extend也可以是做API調用,也寫個簡單的例子,同樣在控制器里面輸入一段代碼,然后打印,這里創建一個空對象,并把該對象后面的對象拷貝并掛載到該空對象中,并賦值給wscat,那么wscat對象就有對應的這些屬性
var wscat = angular.extend({}, {name:"autumnswind",skill:"none"})
console.log(wscat)
image
image

咱們繼續往下看
angularModule = setupModuleLoader(window)
這里為angular對象創建和加載module()函數,這里我在Angular源碼解讀setupModuleLoader函數有詳細的分析,這里就不多說了,有需要的的可以回頭看一下
繼續下面這句

try {
            angularModule("ngLocale")
        } catch (e) {
            angularModule("ngLocale", []).provider("$locale", $LocaleProvider)
        }

try代碼塊里面首先判斷是否獲取到獲取ngLocale模塊,如果我們獲取不到,則就報個異常(ngLocale默認沒有創建的)
catch代碼塊接受上面的異常(也就是獲取不到ngLocale模塊走catch分支),然后在這個位置注冊ngLocale模塊

簡單的說這里angular.module在創建模塊的時候,傳遞一個參數的時候,是獲取模塊;傳遞一個以上的是創建新模塊;所以try里面是獲取,catch里面就是創建了
那么這里就成功的創建了一個ngLocale模塊,其實angularModule實際上就是angular.module
angularModule = angular.module
angularModule("ngLocale", []) = angular.module("ngLocale", [])
所以我們就可以鏈式去調用對象moduleInstance中的directive和provider

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

推薦閱讀更多精彩內容

  • 在線閱讀 http://interview.poetries.top[http://interview.poetr...
    前端進階之旅閱讀 114,503評論 24 450
  • 請參看我github中的wiki,不定期更新。https://github.com/ivonzhang/Front...
    zhangivon閱讀 7,155評論 2 19
  • Angular面試題 一、ng-show/ng-hide與ng-if的區別? 第一點區別是,ng-if在后面表達式...
    w_zhuan閱讀 5,549評論 0 26
  • 1、angularjs的幾大特性是什么? 雙向數據綁定、依賴注入、模板、指令、MVC/MVVM 2、列舉幾種常見的...
    2e9a10d418ab閱讀 1,367評論 0 10
  • 二月第一天,二十三小年。今天是送灶王爺上天的日子,城里人都拜拜神,農村人才有。記得小時候,姥姥總會用高粱稈扎一匹小...
    圈_圈_閱讀 131評論 0 0