[angular] 第1869天 请说说在Angular中是如何进行脏检查的？

[haizhilin2013]

trafficstars

第1869天 请说说在Angular中是如何进行脏检查的？

3+1官网

我也要出题

[llccing]

AngularJS（1.x）中的脏检查

在AngularJS（1.x）中，脏检查（Dirty Checking）是变更检测的主要机制。AngularJS通过一个称为“digest cycle”（消化周期）的过程来实现脏检查。每当有数据可能发生变化时（例如，用户输入、HTTP请求等），AngularJS会启动消化周期，遍历所有的$scope，检查每个数据绑定是否发生了变化。如果检测到变化，AngularJS会继续执行直到所有数据稳定为止。

Angular（2+）中的变更检测

在Angular 2及之后的版本中，变更检测机制得到了重大的改进，不再依赖传统的脏检查。Angular 2+ 使用了一种更高效的变更检测机制，结合了以下几种技术：

1. Zone.js：Angular利用Zone.js来捕获异步事件。当这些事件（如用户交互、HTTP请求、定时器等）完成时，Zone.js会触发变更检测。

2. Change Detection Strategy：Angular提供了两种变更检测策略，开发者可以选择使用：

   • Default：默认策略，遍历整个组件树进行检测。
   • OnPush：仅在输入属性发生变化或显式调用markForCheck()时进行检测，适用于纯函数组件或数据变化较少的组件，能显著提升性能。

3. Incremental DOM：Angular的视图更新机制使用增量DOM技术，只更新发生变化的部分，而不是重新渲染整个视图。

4. RxJS和Observable：Angular充分利用RxJS和Observable来处理异步数据流，有效减少不必要的变更检测。

总结

• AngularJS（1.x）：主要依赖脏检查，通过消化周期进行数据绑定的变化检测。
• Angular（2+）：采用了更高效的变更检测机制，不再使用传统的脏检查术语，而是通过Zone.js、不同的变更检测策略、增量DOM和RxJS等技术来实现数据变化的检测和视图更新。

因此，在Angular 2及其后续版本中，“脏检查”这个词已经不再被使用，因为变更检测机制已经进行了优化和改进，不再依赖于脏检查的方式。

变更检测详细见这里 https://github.com/haizlin/fe-interview/issues/5835