AngularJS 開發框架介紹

AngularJS 框架介紹
一個由 Google 傾力打造的前端 JavaScript 框架，與其他 JS 框架最大的不同在於，他直接延伸現有的 HTML 架構，透過 宣告式語法 (Directives Syntax) 直接賦予 HTML 額外的超能力，讓 Web 應用程式在元件化的過程變得極其簡潔有力。我在 ASP.NET MVC 分享中常講的「關注點分離」與「以習慣取代配置」特性，在 AngularJS 框架中可謂落實的鉅細靡遺。
其「關注點分離」的部分，在於 控制器 (Controllers) 與 檢視 (Views) 之間切割的非常乾淨，再搭配 模組 (module) 與 相依性注入 (Dependency Injection) 相關實作，如 工廠 (factory) 與 服務 (service)、提供者 (provider) 與 常數值 (value) 等等，在在落實了「關注點分離」這個觀念。一般來說，越強調開發概念、架構越抽象的東西，越不容易上手，但對一個有經驗的開發人員來說，AngularJS 絕對是一個不可多得的好物，而對新手來說，也正好是個磨練的好機會。
而「以習慣取代配置」部分，AngularJS 確實有其獨到之處，他所設計的 宣告式語法 (Directives) 直接延伸 HTML 的能力，讓許多 AngularJS 自訂的 HTML 屬性自然而然地融入 HTML 之中，並且賦予其意義，而這就是所謂的 習慣 (Convention)。這是大多數 JS 框架不敢做的嘗試，也因為這樣，這樣的設計觀點並不是所有人都能接受，信者恆信、不信者恆不信，變成一種信仰(belief)，我只是剛好成為信徒而已。
另 外，在大多數 JS 框架當中，都會實作所謂的範本引擎 (Template Engine)，但大多數範本引擎都是利用「字串」型態來定義網頁片段的範本，然後透過 JavaScript 進行變數字串取代後，再將字串插入到原本的 DOM 樹系之中，所以會有一些隱含的型別轉換成本。但是在 AngularJS 裡，當瀏覽器將 HTML 與這些 AngularJS 自訂的語法解析成 DOM 物件之後，AngularJS 會直接將原生的 DOM 物件當作網頁片段的範本，然後直接以 DOM 物件 (原生的 JavaScript 物件) 進行操作，大幅減少型別轉換的成本，相對的在範本操作的過程，其效能也比其他框架來的高出許多，這也就是 AngularJS 之中所謂的 DOM Templates 特性。
AngularJS 所提供的 雙向資料繫結 (Two Way Data-Binding) 特性，可以說是最酷最實用的功能之一，但這個特性並不是 AngularJS 所獨有，其他 JS 框架也大多都有此特性，不過對於沒有接觸過其他框架的人來說，確實是一個非常酷炫有趣的功能之一。



原始介紹文章出自於此