深度 $watch 与 $watchCollection：$var 行为

Question

$watchCollection 是否能够忽略对以 $ 开头的属性的更改？这种行为已经存在使用深层$watch，因为它依赖于angular.equals 进行比较。

理想情况下，$watchCollection 是浅层观察对象的首选（也是唯一）方法。不同的行为是否有正当理由？

例子

$scope.foo = {
  $bar: 'someValue',
  baz: 123456
};

$scope.$watch('foo', function() { 
   console.log('watch'); 
}, true);

$scope.$watchCollection('foo', function(){ 
   console.log('watchCollection'); 
});

// logs 'watch'
// logs 'watchCollection'
$scope.foo.baz = 654321;

// logs 'watchCollection'
$scope.foo.$bar = 'changed'

Answer 1

取自angular$watch源代码cmets：

objectEquality == true 时，watchExpression 的不等式由 {@link angular.equals} 函数确定。

我们可以从angular.equals 文档中看到：

在属性比较期间，函数类型的属性和名称以 $ 开头的属性将被忽略。

这就解释了为什么 $watch 比较忽略 $ 属性。

$watchCollection 函数实际上进行了自己的比较，以检查对象是否相同、它们是否是数组以及它们是否是数组，它会检查值是否相同。直接取自源代码：

if (oldLength !== newLength) {
    // if lengths do not match we need to trigger change notification
    changeDetected++;
    oldValue.length = oldLength = newLength;
}
// copy the items to oldValue and look for changes.
for (var i = 0; i < newLength; i++) {
    oldItem = oldValue[i];
    newItem = newValue[i];

    bothNaN = (oldItem !== oldItem) && (newItem !== newItem);
    if (!bothNaN && (oldItem !== newItem)) {
        changeDetected++;
        oldValue[i] = newItem;
    }
}

我不能说他们是否是故意这样实现的，但肯定是这样的 =D