以前開發(fā)（web或者移動(dòng)端）前端主要使用jQuery+原生js,如果使用某些前端UI框架的話，它自己還可能提供一些API可以使用。而且目前很多UI框架都是基于jQuery的，所以說(shuō)一下由jQuery跨到angularjs跨度較大，研究了一段時(shí)間的angularjs ,下面從整體上說(shuō)說(shuō)感受吧:

關(guān)于和jquery的比較

首先angular是一個(gè)mvc框架，它與jquery不同之處在于，前者致力于mvc代碼解耦，采用model,controller以及view方式去組織代碼，而后者提供給你了很多APi函數(shù)，你可以不用寫很多原生js去實(shí)現(xiàn)比較復(fù)雜的效果，比如說(shuō)動(dòng)畫，$.animate,這樣的效果如果需要原生js來(lái)寫的話，代碼量將會(huì)比較龐大；

其次，jQuery沒有定義你的代碼如何組織，你可以將它放在一個(gè)單獨(dú)的js文件中進(jìn)行引用，也可以直接寫在頁(yè)面中采用script標(biāo)簽進(jìn)行包裹，甚至可以直接以內(nèi)聯(lián)的方式寫在html標(biāo)簽中，但是angularjs會(huì)將一個(gè)HTML頁(yè)面分成若干個(gè)模塊，每個(gè)模塊都可以自己的scope，service以及directive，各個(gè)模塊之間也可以進(jìn)行通信，但是整體上結(jié)構(gòu)是比較清晰的，就是說(shuō)其代碼組織方式是模塊化的。

最后，jQuery的思想是先設(shè)計(jì)好頁(yè)面，然后在已有頁(yè)面的基礎(chǔ)上進(jìn)行dom操作后展示頁(yè)面，但是angular的view可能僅僅是一個(gè)框架，對(duì)view的dom操作或者時(shí)間監(jiān)聽都是在directive中實(shí)現(xiàn)的，而且一般情況下很少自己直接去寫Dom操作代碼，只要你監(jiān)聽model。model發(fā)生變化后view也會(huì)發(fā)生變化。

關(guān)于適用場(chǎng)合

jQuery應(yīng)該適用于大多數(shù)web開發(fā)，移動(dòng)端也有（jQuerymobile），angularjs有人說(shuō)更適合做SPA（我個(gè)人認(rèn)為在手機(jī)上的SPA可能會(huì)引發(fā)性能上的問(wèn)題，因?yàn)樗呐K檢查機(jī)制會(huì)影響性能），在web端，一些CRUD的應(yīng)用或者管理類軟件還是可以使用的（當(dāng)然這里的理解可能不一定準(zhǔn)確，會(huì)隨著深入學(xué)習(xí)更多去了解和使用）。

關(guān)于UI的結(jié)合

開發(fā)任何產(chǎn)品都需要用到前端UI，目前很多UI是基于jQuery的，這意味著你如果要用angularjs和這些Ui組件的話，需要用angularjs的directive去重寫些組件，這一過(guò)程是比較麻煩的，所幸的是，angular給我們提供了一些UI組件可以使用（web端主要是結(jié)合bootstrap前端組件），http://angular-ui.github.io/，而在移動(dòng)端主要是結(jié)合ionic框架http://ionicframework.com/，但是隨著angular的發(fā)展，很多HTML5的前端框架也慢慢集成了angularjs版本可供使用。

關(guān)于angularjs的特點(diǎn)

1.數(shù)據(jù)的雙向綁定：這可能是其最激動(dòng)人心的特性吧，view層的數(shù)據(jù)和model層的數(shù)據(jù)是雙向綁定的，其中之一發(fā)生更改，另一方會(huì)隨之變化，這不用你寫任何代碼?。ㄏ胂雑Query方式下怎么做吧）

2.代碼模塊化，每個(gè)模塊的代碼獨(dú)立擁有自己的作用域，model，controller等。

3.強(qiáng)大的directive可以將很多功能封裝成HTML的tag,屬性或者注釋等，這大大美化了HTML的結(jié)構(gòu)，增強(qiáng)了可閱讀性；

4.依賴注入，將這種后端語(yǔ)言的設(shè)計(jì)模式賦予前端代碼，這意味著前端的代碼可以提高重用性和靈活性，未來(lái)的模式可能將大量操作放在客戶端，服務(wù)端只提供數(shù)據(jù)來(lái)源和其他客戶端無(wú)法完成的操作；

5.測(cè)試驅(qū)動(dòng)開發(fā)，angularjs一開始就以此為目標(biāo)，使用angular開發(fā)的應(yīng)用可以很容易地進(jìn)行單元測(cè)試和端對(duì)端測(cè)試，這解決了傳統(tǒng)的js代碼難以測(cè)試和維護(hù)的缺陷

以上就是研究angularjs一段時(shí)間得出的結(jié)論，其中某些地方可能有所疏漏，沒關(guān)系，接下來(lái)會(huì)展開其中某一點(diǎn)一步步去學(xué)習(xí)。

最新評(píng)論