AngularJS and jQuery 近期專案開發心得

最近好久沒寫文章了，因為這陣子遇到的事情太多太雜...，但是學到很多...，可是我沒有辦法一一記錄下來，...一時也提不起勁啊，這篇只好用一種當作日記的心情來寫寫了，請大家看看就好，不用太認真 xd，真的。

還有我不想跟大家筆戰，我只是分享一個專案同時使用 AngularJS 跟 jQuery 的感覺是什麼，是『AngularJS and jQuery』，而不是『AngularJS v.s jQuery』，更何況每個專案的體質本來就不同。

AngularJS  (logo來源)
前陣子社群非常活躍的一套 JavaScript Framework，我一直很想嘗試看看使用 AngularJS 是什麼感覺，但是我想一路走來的人都能理解，有時候寫玩具跟真正用在專案上是真的不太一樣的感覺 (當然自己的玩具也叫做專案xd)，只是有客戶的苛求，比較能夠往更多地方鑽研，如果什麼事情都照著工程師的想法做，那當然做什麼都比較順，因為我們都知道，『怎麼做對自己比較方便，而且可以達到一樣的功能』，恩...有點離題了。

所以這次用在工作的專案上，因為專案的需求，會使用到較多的 Ajax 的 Request，來替換頁面上的內容，因為 AngularJS 順暢的 Data Binding 的特性，以及 View Template，因此感覺蠻適合使用 AngularJS 作為這次專案想用的 Framework，從學習怎麼用 $http 到串到專案的功能，大約不會超過4天。 （我必須說明這次真的有太多的時間花在學習 AngularJS 的架構)。

說實在的，如果我今天很熟練 AngularJS，我想時間開支不會超過4天，以開發速度來說，AngualarJS 真的是不錯的選擇，再加上我第一次認真用過MV* 架構的 Framework，寫起來程式碼真的有架構許多，說實在的，如果還有機會，我是一定會再使用 AngularJS，或是學習其他 Framework，工具雖然學不完，但是這些架構跟 Framework 的設計真的蠻值得學習。

不過從 jQuery 寫到 Angular，一定要完全忘記 DOM 這件事情，剛開始用 Angular 有點不習慣，動不動我就想要用 selector，但是... 真的，要學會『綁手綁腳』的使用 Angular，我現在也正在努力適應這件事。:)



jQuery
jQuery 算是我比較熟的，從大學在程式設計公司打工時就是寫 jQuery，中間從來沒換過，至於他的優，我就不再多介紹了，但是就以這次專案遇到的功能，我真的是蠻想捨棄 jQuery 的...，(因為覺得 AngularJS 的 Temlate 太好用了...)，可是最後我還是把整個 AngularJS 改成 jQuery code 了，原因詳見下方轉折點。




轉折點
因為整個專案並不是公司自己開發的產品，因此要考慮到客戶想支援的瀏覽器程度，最後還是改用 jQuery 了，說實話心裡覺得有點杯具，3天內把整個之前用 Angular 寫好的功能改成用 jQuery 寫，還包含要不斷的測試。

• 最大的問題是 IE 瀏覽器版本的支援

為了符合客戶的 IE 瀏覽器的支援性，我自己測試是 AngularJS 在 IE7 完全沒辦法(我怎麼找都沒找到解法，如果有歡迎告訴我，謝謝～)，所有的表達式 {{expression }} 都會暴露在畫面上，並且也抓不到 Ajax 吐回來的資料，IE8 是有解法，就像官方網站上寫的那幾招。

還有一些 Angular 本來就很方便的功能，像是 $filter, $watch ...，使用 jQuery 全部要自己來，而且瀏覽器反應的速度真的有差。

遺憾的是，因為趕時程的關係，好像留下不少程式負債，總覺得不知道 jQuery 到底要怎麼寫，才會比較有架構，比較好讓人維護，這次很汗顏沒有寫的很好，而且我覺得我的 code 真的有夠『得體』(Dirty)。

好玩的是，平常沒有這麼多閒功夫，因為這次的教訓，一樣的功能用 jQuery 跟 AngularJS 各寫一次，真的很有感覺...。也算是長知識了。能夠靠專案學到這些，感覺也是挺過癮的。