什么是脏检查

Posted 2020-11-14 eret9616

网上的资料(尤其是非StackOverFlow的，中文博客内容的，)可能会有不正确的地方，产生误导，但是看这些东西的话还是能帮助理解。

 

个人总结:

脏检查的全名是 脏数据检查。是AngularJS命名的。

脏数据也就是产生了变化的数据。

angularJS监测对象变化不是像vue.js那样通过Object.defineproperty这种接口，而是通过复制保存一份数据，进行快照对比，来监测变化。

 

脏检查这个东西，其实在三大主流前端框架中或多或少都有涉及。React 每次生成新的 Virtual DOM，与旧 Virtual DOM的 diff 操作本来就可以看做一次脏检查。Vue 从相对彻底的抛弃了脏检查机制，使用 Property 主动触发 UI 更新，但是 Vue 仍然不能抛弃 track by (用来标记数组元素的key) 这个东西。

 

通过将新旧数组的 track by 元素做 diff 猜测用户的行为，最大可能的减少 DOM 树的操作，这就是 track by的用处。

 

Angular 1的性能被广为诟病，因为在 Angular 1 的机制下，脏检查的执行范围过大以及频率太过频繁了。

 

 

 

资料一:

AngularJS remembers the value and compares it to a previous value. This is basic dirty-checking. If there is a change in value, then it fires the change event.

 

资料二:

Angular defines a concept of a so called digest cycle. This cycle can be considered as a loop, during which Angular checks if there are any changes to all the variables watched by all the $scopes. So if you have $scope.myVar defined in your controller and this variable was marked for being watched, then you are explicitly telling Angular to monitor the changes on myVar in each iteration of the loop.

 

 

资料三: 

 

资料四:

angular中变量是双向绑定的 ，那么怎么知道一个变量是否是变化了呢？

1能通过固定的接口才能改变变量的值，比如说只能通过set()设置变量的值，set被调用的时候比较一下就知道了。这种方法的缺点是写法比较繁琐。

2脏检查，将原对象复制一份快照，在某个时间，比较现在对象与快照的值，如果不一样就表明发生了变化，这个策略要保留两份变量，而且要遍历对象，比较每个属性，这样会有一定的性能问题

 

angular使用的就是脏检查：

1不会脏检查所有的对象。当对象被绑定到html中后，这个对象才会添加为检查对象（watcher）

2不会脏检查所有的属性，同样当属性被绑定后，这个属性才会被列为检查的属性

在angular程序初始化时，会将绑定的对象的属性添加为监听对象（watcher），也就是说一个对象绑定了N个属性，就会添加N个watcher。

angular什么时候去脏检查呢？angular所系统的方法中都会触发比较事件，比如：controller初始化的时候，所有以ng-开头的事件爱你执行后，都会出发脏检查

 

资料五:

https://segmentfault.com/a/1190000010433675