建站
咨詢
售后
建站咨詢
新聞中心
AngularJS是很多Web開發(fā)人員在打造單頁面應用程序時的***創(chuàng)建方案。必須承認，無論開發(fā)哪一種應用程序類型，團體以及個人開發(fā)人員都將不可避免地面臨一系列挑戰(zhàn)，不過使用AngularJS將大大降低整個流程的實現(xiàn)難度。在AngularJS的幫助下，大家將能夠充分享受單頁面應用程序開發(fā)與測試的過程，因為其提供的框架囊括了客戶端模型-視圖-控制器以及開發(fā)端模型-視圖-視圖模式。另外，它還提供大量其它功能組件，足以幫助用戶創(chuàng)建出富互聯(lián)網(wǎng)應用程序。
創(chuàng)新互聯(lián)-專業(yè)網(wǎng)站定制、快速模板網(wǎng)站建設、高性價比自流井網(wǎng)站開發(fā)、企業(yè)建站全套包干低至880元,成熟完善的模板庫,直接使用。一站式自流井網(wǎng)站制作公司更省心,省錢,快速模板網(wǎng)站建設找我們，業(yè)務覆蓋自流井地區(qū)。費用合理售后完善，十載實體公司更值得信賴。
然而盡管開發(fā)人員對于AngularJS已經(jīng)相當熟悉，但仍有很多潛在錯誤在不知不覺中給應用構建工作帶來負面影響。不過只須遵循幾項預防措施，我們就完全能夠對其加以規(guī)避。下面來看最為常見的幾種AngularJS錯誤：
1.在AngularJS當中不顧實際情況，一味利用匿名函數(shù)進行聲明
請始終將自己的對象及函數(shù)分配給特定變量。通過這種方式，大家會發(fā)現(xiàn)控制與變更工作會變得更加輕松，代碼本身也會更加整潔且易于查閱。另外，大家能夠在不同文件當中對代碼進行輕松拆分，而這一點對于應用程序的后續(xù)維護而言非常重要。
與此同時，這種作法對于保障可測試性也有著重要意義；當聲明關系較為明確性，代碼的測試工作將變得非常簡單。作為開發(fā)人員，大家應當讓自己的代碼更加直觀且易于理解，而這一切都將在長久的工作周期中帶來回報?？偠灾?，遵循這一原則將幫助各位顯著降低錯誤數(shù)量并帶來諸多收益。
2.未使用$applyAsync
由于在AngularJS當中調(diào)用$digest()不存在輪詢機制，因此其只會執(zhí)行現(xiàn)有指令。$applyAsync則能夠幫助我們有效延遲表達式解析，直到下一個$digest()周期的來臨。大家可以選擇以手動或者自動方式使用$applyAsync。
3. 使用jQuery
在處理事件以及實現(xiàn)AJAX操作時，jQuery已經(jīng)成為一套能夠顯著降低DOM操作難度的庫選項。但在另一方面，AngularJS的設計初衷在于提供一套能夠創(chuàng)建可擴展性應用程序的框架。其主要關注側重在于應用程序的開發(fā)與測試環(huán)節(jié)，因此其無法被用于在HTML頁面中實現(xiàn)擴展。換言之，在這種情況下我們并不需要使用jQuery。這時大家的理想選擇應該是讓自己的代碼在進行聲明之后超越HTML語法。
AngularJS在這方面擁有多項功能可供選擇，開發(fā)人員應該能夠從中找到最理想的實現(xiàn)方案，而非一味使用jQuery。如果大家必須要進行DOM操作，那么在指令中直接實現(xiàn)即可——而并不一定需要涉及jQuery。
4.未對應用程序進行優(yōu)化
缺乏必要優(yōu)化幾乎必然會引發(fā)AngularJS錯誤。以下示例解釋了控制器中的代碼如何拖慢處理速度并導致潛在錯誤：
- this.maxPrice = '100';
- this.price = '55’;
- $scope.$watch('MC.price', function (newVal) {
- if (newVal || newVal === 0) {
- for (var i = 0; i < 987; i++) {
- console.log('ALL YOUR BASE ARE BELONG TO US');
- }
- }
- });
作為解決方案，我們可以嘗試在輸入內(nèi)容中添加一項超時。
5.在非必要情況下使用scope隔離
如果大家希望使用一條指令，且確保其只被應用于單一位置且不會在環(huán)境中引發(fā)其它意料之外的沖突，那么其實并不一定要使用scope隔離機制——這有可能反而造成錯誤。在這里需要強調(diào)的是，我們無法在單一元素當中同時使用兩條scope隔離指令。另外，在進行嵌套、事件處理或者繼承等操作時，scope隔離也有可能引發(fā)問題。
6. 使用過多觀察程序
對于每一次聯(lián)編，AngularJS都會為其創(chuàng)建一個觀察程序。而在每個digest階段，觀察程序都會與之前的聯(lián)編進行對比與評估，AngularJS將這一過程稱為臟檢查。大家可以想象一下，當這一系列流程結束之后，最終會剩下多少觀察程序。
其實約束觀察程序數(shù)量的辦法非常簡單，大家只需要在確定scope模型不會發(fā)生變更的情況下不對其進行觀察即可。這意味著觀察程序數(shù)量將大幅減少，而由此引發(fā)錯誤的機率也會顯著降低。
7.忽視controllerAs語法
$scope常常被用于將某個模型分配至某個控制器對象。不過在這種情況下，注入scope一般并不是最理想的處理方式。相反，我們推薦大家選擇controllerAs語法來實現(xiàn)這一目標。下面通過代碼共同了解如何利用controllerAs語法進行模型定義：
- function MainController($scope) {
- this.foo = 1;
- var that = this;
- var setBar = function () {
- // that.bar = {someProperty: 2};
- this.bar = {someProperty: 2};
- };
- setBar.call(this);
- // there are other conventions:
- // var MC = this;
- // setBar.call(this); when using 'this' inside setBar()
- }
controllerAs語法能夠顯著改善結果混亂的狀況，特別是在我們需要處理大量嵌套scope的情況下。它還能夠以多種其它方式加以運用，從而幫助我們更輕松地實現(xiàn)應用程序構建。
8. 負載強度過大
很多Web開發(fā)人員傾向于在AngularJS當中使用大量高強度處理線程，而克服這一壞習慣之后，我們可以使用工作線程并避免由高強度處理任務帶來的諸多錯誤。高強度處理任務可能導致瀏覽器陷入卡死。工作線程是解決這類問題的好辦法，我們只需要直接使用工作線程機制即可，其能夠顯著降低大規(guī)模復雜對象的處理難度。
9.未能根據(jù)需要使用controllerAs語法
controllerAs語法具備極高的實用性，而且能夠幫助大家在構建應用程序時擁有更出色的代碼成果。當下開發(fā)人員的常見錯誤之一就是未能對其加以充分運用并發(fā)揮其巨大潛能。事實上，當我們將某套模型分配至某控制器工具時，controllerAs語法應當是***的實現(xiàn)機制。它還擁有一系列其它高實用度功能。下面通過代碼示例一起了解：
- function MainController($scope) {
- this.title = 'Some title';
- $scope.$watch(angular.bind(this, function () {
- return this.title;
- }), function (newVal, oldVal) {
- // handle changes
- });
- }
10. 未能充分理解解析器
基本上，解析器的介入會增加我們在載入視圖時的實際時間。大家不應過度使用解析器，因為這意味著網(wǎng)站的加載時間會因此延長，并最終導致令人難以忍受的訪問體驗。
其中一部分錯誤會引發(fā)Web開發(fā)人員最不希望看到的結果。而只要大家在開發(fā)工作當中考慮到這些問題的存在并加以解決，那么很多錯誤將根本不會出現(xiàn)，這也就免除了我們被迫從頭開始重新進行代碼編寫的可能性。
文章題目：AngularJS開發(fā)工作當中必須避免的十種常見錯誤
本文鏈接：http://www.dlmjj.cn/article/cdeospg.html
