乐博娱乐»NodeJS»AngularJS乐博娱乐开发事情当中必须制止的十种常见错误

AngularJS乐博娱乐开发事情当中必须制止的十种常见错误

来源:51cto 宣布时间:2015-12-10 阅读次数:乐博

  AngularJS是许多Web乐博娱乐开发人员在打造单页面应用程序时的首选创建方案。必须认可,无论乐博娱乐开发哪一种应用程序类型,团体以及小我私家乐博娱乐开发人员都将不行制止地面临一系列挑战,不外使用AngularJS将大大降低整个流程的实现难度。在AngularJS的帮助下,各人将能够充实享受单页面应用程序乐博娱乐开发与测试的历程,因为其提供的框架囊括了客户端模型-视图-控制器以及乐博娱乐开发端模型-视图-视图模式。另外,它还提供大量其它功效组件,足以帮助用户创建出富互联网应用程序。

乐博

  然而尽管乐博娱乐开发人员对于AngularJS已经相当熟悉,但仍有许多潜在错误在不知不觉中给应用构建事情带来负面影响。不外只须遵循几项预防措施,我们就完全能够对其加以规避。下面来看最为常见的几种AngularJS错误:

  1.在AngularJS当中掉臂实际情况,一味利用匿名函数进行声明

  请始终将自己的工具及函数分配给特定变量。通过这种方式,各人会发现控制与变换事情会变得越发轻松,代码自己也会越发整洁且易于查阅。另外,各人能够在差异文件当中对代码进行轻松拆分,而这一点对于应用程序的后续维护而言很是重要。

  与此同时,这种作法对于保障可测试性也有着重要意义;当声明关系较为明确性,代码的测试事情将变得很是简朴。作为乐博娱乐开发人员,各人应当让自己的代码越发直观且易于理解,而这一切都将在恒久的事情周期中带来回报。总而言之,遵循这一原则将帮助列位显著降低错误数量并带来诸多收益。

  2.未使用$applyAsync

  由于在AngularJS当中调用$digest()不存在轮询机制,因此其只会执行现有指令。$applyAsync则能够帮助我们有效延迟表达式解析,直到下一个$digest()周期的来临。各人可以选择以手动或者自动方式使用$applyAsync。

  3. 使用jQuery

  在处置惩罚事件以及实现AJAX操作时,jQuery已经成为一套能够显著降低DOM操作难度的库选项。但在另一方面,AngularJS的设计初衷在于提供一套能够创建可扩展性应用程序的框架。其主要关注偏重在于应用程序的乐博娱乐开发与测试环节,因此其无法被用于在HTML页面中实现扩展。换言之,在这种情况下我们并不需要使用jQuery。这时各人的理想选择应该是让自己的代码在进行声明之后逾越HTML语法。

  AngularJS在这方面拥有多项功效可供选择,乐博娱乐开发人员应该能够从中找到最理想的实现方案,而非一味使用jQuery。如果各人必须要进行DOM操作,那么在指令中直接实现即可——而并纷歧定需要涉及jQuery。

  4.未对应用程序进行优化

  缺乏须要优化险些一定会引发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'); 
} 
} 
}); 

  作为解决方案,我们可以实验在输入内容中添加一项超时。

  5.在非须要情况下使用scope隔离

  如果各人希望使用一条指令,且确保其只被应用于单一位置且不会在情况中引发其它意料之外的冲突,那么其实并纷歧定要使用scope隔离机制——这有可能反而造成错误。在这里需要强调的是,我们无法在单一元素当中同时使用两条scope隔离指令。另外,在进行嵌套、事件处置惩罚或者继续等操作时,scope隔离也有可能引发问题。

  6. 使用过多视察程序

  对于每一次联编,AngularJS都市为其创建一个视察程序。而在每个digest阶段,视察程序都市与之前的联编进行对比与评估,AngularJS将这一历程称为脏检查。各人可以想象一下,当这一系列流程结束之后,最终会剩下几多视察程序。

  其实约束视察程序数量的措施很是简朴,各人只需要在确定scope模型不会发生变换的情况下差池其进行视察即可。这意味着视察程序数量将大幅淘汰,而由此引发错误的机率也会显著降低。

  7.忽视controllerAs语法

  $scope经常被用于将某个模型分配至某个控制器工具。不外在这种情况下,注入scope一般并不是最理想的处置惩罚方式。相反,我们推荐各人选择controllerAs语法来实现这一目标。下面通过代码配合了解如何利用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的情况下。它还能够以多种其它方式加以运用,从而帮助我们更轻松地实现应用程序构建。

  8. 负载强渡过大

  许多Web乐博娱乐开发人员倾向于在AngularJS当中使用大量高强度处置惩罚线程,而克服这一坏习惯之后,我们可以使用事情线程并制止由高强度处置惩罚任务带来的诸多错误。高强度处置惩罚任务可能导致浏览器陷入卡死。事情线程是解决这类问题的好措施,我们只需要直接使用事情线程机制即可,其能够显著降低大规模庞大工具的处置惩罚难度。

  9.未能凭据需要使用controllerAs语法

  controllerAs语法具备极高的实用性,而且能够帮助各人在构建应用程序时拥有更精彩的代码结果。当下乐博娱乐开发人员的常见错误之一就是未能对其加以充实运用并发挥其巨大潜能。事实上,当我们将某套模型分配至某控制器工具时,controllerAs语法应当是首选的实现机制。它还拥有一系列其它高实用度功效。下面通过代码示例一起了解:

function MainController($scope) { 
this.title = 'Some title'; 
$scope.$watch(angular.bind(this, function () { 
return this.title; 
}), function (newVal, oldVal) { 
// handle changes 
}); 
} 

  10. 未能充实理解解析器

  基本上,解析器的介入会增加我们在载入视图时的实际时间。各人不应太过使用解析器,因为这意味着网站的加载时间会因此延长,并最终导致令人难以忍受的会见体验。

  其中一部门错误会引发Web乐博娱乐开发人员最不希望看到的结果。而只要各人在乐博娱乐开发事情当中考虑到这些问题的存在并加以解决,那么许多错误将基础不会泛起,这也就免除了我们被迫重新开始重新进行代码编写的可能性。