大家好，我是IT修真院武漢分院學員余佳貝淆两，一枚正直純潔善良的WEB前端程序員。
今天給大家分享一下默终，修真院官網JS任務10，深度思考中的知識點——ANGULAR有哪些優(yōu)缺點?
1.背景介紹
Angular.js是google開發(fā)者設計和開發(fā)的一套前端開發(fā)框架犁罩，幫助你簡化前端開發(fā)的負擔齐蔽。
AngularJS 通過新的屬性和表達式擴展了 HTML。
AngularJS 可以構建一個單一頁面應用程序
那么AngularJS有哪些優(yōu)點與缺點呢床估？
2.知識剖析
AngularJS的優(yōu)點與缺點：
AngularJS的優(yōu)點：
1.良好的應用程序結構：
通常情況下肴熏，我們編寫 JavaScript 沒有明確的結構。雖然在編寫小應用程序的時候沒有問題顷窒，但這顯然是不適合于大規(guī)模的應用程序。
使用 AngularJS源哩，您可以通過MVC（模型 - 視圖 - 控制器）或MVVM （模型 - 視圖 - 視圖模型）模式來組織源代碼鞋吉。
AngularJS 是一個 MVW 框架，其中W代表可以用于任何項目励烦。你可以組織你的代碼模塊谓着，它可顯著提高應用程序的可測試性和可維護性。數(shù)據(jù)坛掠、業(yè)務邏輯、視圖的分離屉栓。
2.雙向數(shù)據(jù)綁定
數(shù)據(jù)綁定肯定是 AngularJS 最佳功能之一。
你可以聲明綁定的模型到 HTML 元素牲平。當模型發(fā)生變化時，視圖會自動更新域滥，反之亦然纵柿。
這可以減少大量的傳統(tǒng)樣板代碼，保持模型和視圖同步昂儒。
3.指令
自定義Directive，比jQuery插件還靈活渊跋，但是需要深入了解Directive的一些特性腊嗡，簡單的封裝容易，復雜一點官方沒有提供詳細的介紹文檔刹枉，我們可以通過閱讀源代碼來找到某些我們需要的東西叽唱，如：在directive使用 $parse微宝；
4.HTML 模板
AngularJS 使用 HTML 模板，這使事情變得簡單镶摘，并允許設計人員和開發(fā)人員同時工作岳守。
設計人員可以按照通常的方式創(chuàng)建用戶界面，而開發(fā)人員可以使用聲明性綁定語法很容易配合不同的UI組件的數(shù)據(jù)模型湿痢。
5.依賴注入
ng模塊化比較大膽的引入了Java的一些東西（依賴注入），能夠很容易的寫出可復用的代碼拒逮，對于敏捷開發(fā)的團隊來說非常有幫助臀规，我們的項目從上線到目前，UI變化很大塔嬉，在摸索中迭代產品，但是js的代碼基本上很少改動恩袱。
AngularJS的缺點:
1.性能
雙向數(shù)據(jù)綁定是一把雙刃劍胶哲。隨著組件增加，項目越來越復雜俩檬，雙向數(shù)據(jù)綁定帶來性能問題。
雙向數(shù)據(jù)綁定是如何影響性能的棚辽？在JavaScript（ES5）中，并沒有實現(xiàn)當變量或對象改變時發(fā)出通知的功能榔组，Angular的實現(xiàn)方法被叫做“Dirty-checking（臟檢查機制）”联逻，通過跟蹤數(shù)據(jù)的改變再動態(tài)更新用戶界面（UI）。 在Angular的作用域中任何操作的執(zhí)行都會引發(fā)Dirty-checking包归，隨著綁定數(shù)量的增加性能就會越低。
2. Angular 2.0推翻重做使得目前不宜采用此框架
Angular 1.x版本其實是個比較舊的東西了换可，現(xiàn)在看來有些理念過時了厦幅，比如依賴注入、自己獨特的模塊化确憨，這些東西其實在ES6下已經很好地被解決了休弃。 Angular的2.0幾乎是一個推翻重做的框架，估計不會有1.X的upgrade方案玫芦。所以如果現(xiàn)在新開始的項目采用Angular的話本辐，會是一個很尷尬的時機。同樣老虫，如此大的改動似乎也反面印證了1.X并不是那么好茫多。
3.學習成本高
使用Angular需要學習大量的概念，包括但不限于：?
○ 模塊
○ 控制器
○ 指令
○ 作用域
○ 模板
○ 鏈式函數(shù)
○ 過濾器
○ 依賴注入
4.不適合類型開發(fā)：
(1：內容網站夺欲，需要SEO的。(SEO目前也有了prerender解決方案) https//prerender.io
(2：交互頻繁的些阅，如游戲之類交互體驗網站。
(3黎泣，太過于簡單的頁面缤谎。
Angular更適合于CRUD的管理系統(tǒng)開發(fā)。
3.常見問題
Angular2 相比 Vue 有什么優(yōu)勢托呕？
4.解決方案
Angular2相對于Vue的優(yōu)勢在Vue2.0之后已經削弱很多了洋访。比如SSR（Vue2已經原生支持）和全棧式框架（官方推薦Vuex+Vue-Router），native端也有阿里巴巴的weex姻政。但是Angular2在API設計的完整度和覆蓋度上還是Vue所不能及的，主要有這么幾點:
1. Angular2原生Form支持： Angular2原生的Form模塊功能相當強大鹊碍。除了雙向綁定之類的基本功能食绿，還能通過programatic API 控制dom元素的表單行為。也有成型API提供自定義validator耀销。這一點Vue只有v-model和第三方庫铲汪。對于后臺之類的重表單應用，還是Ng2有優(yōu)勢狰住。
2. 依賴注入無論你喜不喜歡DI齿梁，這就是Angular2的強大功能之一肮蛹。有DI可以在不改變代碼結構的情況下完成功能替換创南。（如，在desktop和mobile有不同功能扰藕，可以通過注入不同service實現(xiàn)，而共用相同的template和directive）未桥。Vue則需要程序員自己規(guī)劃代碼組織芥备，用來支持共享組件。DI也可以用于類似module local state的功能亦镶。比如袱瓮，一個視頻播放控件有幾個子組件完成，子組件需要分享一個狀態(tài)尺借。這一點Angular2有原生的service injection pattern燎斩。而Vue則沒有官方推薦。
3. 對標準向后兼容Angular2在一些細節(jié)上對標準有更好的支持栅表。比如 list differ 算法中 Angular2 可以支持實現(xiàn)了Symbol.iterator的對象，而Vue只能支持Array萧落。對Observable和Promise洗贰，Angular2在應用的各個地方，甚至模板級別都有支持(async pipe)宣增。而Vue需要vue-rx等第三方庫支持矛缨。Angular2的組件有shadow dom的實現(xiàn)可以選擇，而Vue目前還沒有箕昭。
4. 測試Angular2一開始就設計好了如何對組件進行測試落竹，而Vue組件雖然也很好寫測試，但是沒有官方推薦的唯一標準（當然述召，對視圖是否需要測試還有待探討）。除此以外藤为，Angular2還有一些小功能比如檢驗模板的類型安全（即夺刑，模板里能在編譯器保證沒有引用model未定義的變量），不過AoT本身似乎還沒有穩(wěn)定存淫，所以不能算優(yōu)勢沼填。對TS的支持也是Angular好，當然前提是你喜歡TS轧邪⌒吆＃總體而言，就是Angular2里你能想到的都有了却邓，你沒想到的它也有了腊徙〖蚴框架的全面性是難以撼動的螟蝙。（當然民傻，為此也付出了相當?shù)拇鷥r）场斑。
5.編碼實戰(zhàn)
6.擴展思考
面對眾多的框架牵署，我們該如何進行選擇？
遇到ng1的時候青责，我到處宣揚jQuery太落后了取具，我們有jqLite就是為了干掉jQuery。
遇到React的時候暇检，我到處宣揚ng1太落后了，狂黑ng1的性能和圍繞$scope的一些設計缺陷心墅。
遇到Vue的時候榨乎，我到處宣揚React太死板了，不允許任何的魔法铐姚，而Vue有恰到好處肛捍，精心設計的魔法。
遇到Elm的時候依许，我到處宣揚React的Redux是抄襲者缀蹄，Vue過于動態(tài)，狂黑因為沒有tagged union+pattern match蛀醉，redux和vuex用起來都很丑衅码。
直到有一天我一個人負責了一個巨型的項目，既有茫茫多的CURD逝段，又有狀態(tài)復雜的特殊界面。
這個項目前端是用react + nuclear.js(那時還沒有redux)寫的夭谤。
在寫CURD時懷念雙向綁定巫糙，寫onChange/value寫的想砸鍵盤。
在寫狀態(tài)復雜的界面時贊嘆React+Nuclear.js組合純函數(shù)+外置state簡直是神器参淹，避免了無數(shù)個bug。
在代碼堆成山的時候會想如果我用的是強類型的Elm是不是可以避免90%的低級錯誤恳不？
完成這個項目之后开呐，我再也不會去捧或黑了。設計是優(yōu)雅還是愚蠢卵惦，其實取決于使用場景瓦戚。 你用的每個框架都有秒殺別人的地方，也都會有用起來很傻的狀況畜疾。
不談具體項目講哪個有優(yōu)勢純屬耍流氓印衔。
7.參考文獻
http://blog.csdn.net/u012125579/article/details/52744093
https://www.zhihu.com/question/40975678
https://www.zhihu.com/question/22284218
8.更多討論
1.Angular1存在哪些問題？
綁定届慈， 一不小心忿偷， 綁太多了，能卡死的頁面半天出不來
2.angular1和angular2有什么不同鲤桥？
1.0.X升級到1.2.X茶凳，貌似有比較大的調整播揪，沒有完美兼容低版本筒狠，升級之后可能會導致一個兼容性的BUG
3.angular對seo友好嗎？
對seo不是特別友好
