一、Angular基础
基础小结
组件
答：每个Angular至少有一个组件【根组件】。 每个组件都会定义一个类，包含应用的数据、逻辑、HTML模板。
less
复制代码
@Component({
selector: 'app-base-info',
templateUrl: './base-info.component.html',
styleUrls: ['./base-info.component.scss']
})
模块
答：一个应用通常包含很多个功能模块。
指令
答：包含特定逻辑和数据，不带视图，多用于特定模板标记的逻辑功能。比如ngIf、ngFor等。
服务
答：跨组件共享的数据或逻辑，可以创建服务类。可作为依赖注入对象注入到使用的组建中。比如接口请求等。
依赖注入
答：providers,全局注入，局部注入(单例)。
管道
答：文本格式化。比如数值格式化、大小写等。
路由
答：全局路由、局部路由。比如懒加载到某个模块，再指定具体的路由。
2. Angular变化检测
变化检测
数据何时变化？
所有的异步操作是可能导致数据变化的根源因素。
- 用户输入操作，比如点击，提交等
- 请求服务端数据
- 定时事件，比如setTimeout，setInterval
如何通知变化
Angular接入了ZoneJS，由它监听了Angular所有的异步事件。其实它重写了所有的异步api！ZoneJS会通知Angular可能有数据发生变化，需要检测更新。
ZoneJS简述
答：异步的事件都会触发ngZone中的hook，hook调用onTurnDone，每当onTurnDone触发，都会调用detectChanges方进行变化检测。
怎么执行变化检测？
答：脏检查。脏检查其实就是存储所有变量的值，每当可能有变量发生变化需要检查时，就将所有变量的旧值跟新值进行比较，不相等就说明检测到变化，需要更新对应视图。
3. Angular生命周期
生命周期
- ngOnChanges
设置或重新设置数据绑定的输入属性时响应。 该方法接受当前和上一属性值的 SimpleChanges 对象 注意，这发生的非常频繁，所以你在这里执行的任何操作都会显著影响性能 - ngOnInit
第一次显示数据绑定和设置指令/组件的输入属性之后，初始化指令/组件 - ngDoCheck
检测，并在发生 Angular 无法或不愿意自己检测的变化时作出反应 - ngAfterContentInit
外部内容投影进组件视图或指令所在的视图之后调用 - ngAfterContentChecked
检查完被投影到组件或指令中的内容之后调用 - ngAfterViewInit
初始化完组件视图及其子视图或包含该指令的视图之后调用 - ngAfterViewChecked
做完组件视图和子视图或包含该指令的视图的变更检测之后调用 - ngOnDestroy
每当 Angular 每次销毁指令/组件之前调用并清扫。 在这儿反订阅可观察对象和分离事件处理器，以防内存泄漏
生命周期顺序
ngOnChanges => ngOnInit => ngDoCheck => ngAfterContentInit => ngAfterContentChecked => ngAfterViewInit =>ngAfterViewChecked
4. Angular vs React vs Vue
从前端开发者的角度来看，React、Vue 将是 2021 年最快学会使用的框架，Vue 和 React 都是轻量级、直观的并且性能完美良好的框架，并且都有着丰富的文档，以及国内丰富的UI组件库，以及大量的社区支持。Angular相对在国内不是那么流行，开发者相对较少，框架较重。
