最近做的項目中,有同時用到angularJS與jquery兩種JS框架。
在使用過程中發現,angularJS的用法更像是面向對象的編程模式。它會要求你定義一個view model,然后所有的頁面變化,是通過改變這個view model來實現的。一旦搭建好了這個框框之后,頁面的操作會非常爽,完全不用考慮具體頁面怎么變化,怎么去操作doom的問題,瀏覽器兼容性的問題angularJS也一並幫你解決了。
而jquery的用法,更像是面向過程的編程模式。你在用jquery寫具體代碼的時候,你需要先考慮到你要實現的場景是怎么樣的,然后把具體的實現過程用代碼表示出來,而且這種實現往往是單向的。也就是說下次你要再進行頁面改變的時候,又得用代碼實現一邊(而angularJS則只要吧view model的數據還原下就可以了)。
angularJS的優點在於,操作頁面變化簡單,你甚至不用去考慮頁面具體怎么變化的。但是缺點是,框架提供的頁面變化往往比較簡單,復制的頁面變化,如動畫,游戲之類的,還是要考jquery來寫會比較方便(angularJS畢竟沒有這種復雜的前端組件實現)。
使用經驗,用angularJS的時候,要把view和model隔離開來,不能經常去修改doom層和css,能做到這點的話,之后怎么改變view model都可以,可以經常改變頁面的顯示狀態。而使用jquery的時候,則相反。要目標明確,因為主要要考慮頁面的變化怎么實現,因此從一種狀態轉化成另一種狀態的時候,盡量保證每次的初始條件都一樣(相同瀏覽器,相同觸發事件,相同環境)。不然會因為jquery的無狀態的特性,會有很多不可預期的變化出現。jquery實現一些復雜的操作的時候,會經常出現類似“打補丁”的情況。這也是由於實現的復雜度和不可控因素所導致的。所以jquery的一些操作會變得很復雜,因此要盡量封裝起來,以便下次重用。
總結,所以angularJS是把view model獨立出來。而jquery是把單次操作獨立出來。兩者關注的點不同,使用場景和使用方法也不同。個人體會是,angularJS像是搭積木,一開始要小心翼翼,搭好之后就可以隨便玩。而jquery則像是搭橋,只需要考慮怎么從一點達到另一點,過程可以是不優雅的,也可以是很高效的。但只要實現了,下次就可以反復重用,只是在運行效率上會有所不同。