Page 444 - AngularJS权威教程

424 第 32 章 优化 Angular 应用

调用$scope.$digest()只会在调用了$digest()及其子节点的具体作用域上运行digest
循环。

32.5 优化$watch 函数

由于$watch列表中的表达式会在每个$digest循环中执行，保持较少的功能很重要。更小以
及更专注的$watch表达式，会让应用程序的性能更好。

在$watch()函数中避免深度比较、复杂的逻辑以及使用少量的循环，会有助于加速应用程序。
例如，可以设置一个监控函数来监控一个对象。假设有一个Account对象：

$scope.account = {
active: true,
userId: 123,
balance: 1000 // 美分
}
假定想要监控任意时刻的账户余额变化，然后在余额为0时设置账户为未激活。可以设置一
个$watch函数来监控这个account对象，每当余额对象变化时更新账户信息：

$scope.$watch('user', function(newAccount) {
if(newAccount.balance <= 0) {
$scope.account.active = false
}
}, true);
$watch()函数中的第三个参数用于告诉Angular，是否使用深度比较来监控这个对象，它会
使用angular.equals()函数检查每个属性。

这个选择将会导致糟糕的性能。不仅Angular会创建一个对象副本，在存储它时需要遍历每
个属性来检查其中是否有任何变化。
这里有一个构建$watch函数的技巧：使用它们跟踪明显会影响视图的变量。对于不会影响视
图的任何事物都不需要使用$watch函数。

有时候移除监控器对我们来说是有意义的，特别是在数据是静态的，并且只想在第一时间将
它暴露给视图的时候，因为这时$watch函数就变得无关紧要了。
从视图中移除自定义的监控器也很容易：让$watch函数自身返回一个为我们移除$watch的
函数即可。
例如，比方说有一个自定义的指令等待解析变量name：

<div data-my-directive name="customerName"></div>
由于这个customerName一旦设置后就不可改变，你可以通过移除已经设置的$watch函数来
优化这个指令：

.directive('myDirective', function($q) {
return {
// ...
scope: {
name: '='
},