1. 程式人生 > >淺談angular原理(個人見解)

淺談angular原理(個人見解)

任何一門語言的學習都需要了解它的核心概念,處理流程和實現原理,這樣才能在編譯出現問題或者沒有達到我們想要的結果時,及時準確的發現問題所在。下面我想談一下我對angular原理的理解,不僅為了加深我自身對於angularjs的理解,同時也希望幫助到正在或即將學習這門語言的人。

Angular是基於MVC模式的開發語言,將應用分解成獨立的表現、資料、邏輯三種元件。MVC讓AngularJS應用更好地結構化,更容易實現和更容易測試。

下面是一個簡單的啟動過程:首先,瀏覽器載入HTML,然後把它解析成DOM,載入angular.js指令碼。之後AngularJS尋找ng-app指令,這個指令指示了應用的邊界,使用ng-app

中指定的模組來配置注入器($injector),注入器($injector)是用來建立“編譯服務($compile service)”和“根作用域($rootScope)”的。編譯服務($compile service)是用來編譯DOM並把它連結到根作用域($rootScope)的。

在執行過程中,利用MVC模式渲染檢視。首先瀏覽器的事件迴圈等待事件的觸發。所謂事件包括使用者的互動操作、定時事件、或者網路事件(伺服器的響應)。在事件觸發後,回撥會被執行。此時會進入Javascript上下文。通常回調可以用來修改DOM結構。一旦回撥執行完畢,瀏覽器就會離開Javascript上下文,並且根據DOM的修改重新渲染檢視。

下面解釋一下幾個重要概念:

檢視:就是指使用者所看見的。 檢視的生命週期由作為一個模板開始,它將和模型合併並最終渲染到瀏覽器的DOM中。與其他模板系統不同的是,AngularJS使用一種獨特的形式來渲染檢視。

模型:模型就是用來和模板結合生成檢視的資料。模型必須在作用域中時可以被引用,這樣才能被渲染生成檢視。和其他框架不一樣的是,Angularjs對模型本身沒有任何限制和要求。你不需要繼承任何類也不需要實現指定的方法以供呼叫或者改變模型。 模型可以是原生的物件雜湊形式的,也可以是完整物件型別的。簡而言之,模型可以是原生的Javascript物件。

控制器:檢視背後的控制程式碼就是控制器。它的主要工作內容是構造模型,並把模型和回撥方法一起傳送到檢視。 檢視可以看做是作用域在模板(HTML)上的“投影(projection)”。而作用域是一箇中間地帶,它把模型整理好傳遞給檢視,把瀏覽器事件傳遞給控制器。

作用域:作用域是用來檢測模型的改變和為表示式提供執行上下文的。它是分層組織起來的,並且層級關係是緊跟著DOM的結構的。

用一句話來總結:在作用域的範圍內,通過控制器的控制和模型方法實現,形成檢視並被渲染到頁面中,最終形成我們所看到的html頁面。