参考：document.readyState - Web API 接口参考 | MDN (mozilla.org)
第一步，JS生命周期第一步
文档加载中状态，document.readyState == loading
第二步，JS生命周期第二步
可交互状态，document.readyState == interactive
第三步，HTML生命周期的第一步
DOMContentLoaded，标识浏览已完全加载HTML并构建DOM树，但样式表之外的外部资源未加载完成。此时处理程序可以查找DOM节点，并初始化接口
第四步，JS生命周期第三步
加载完成，document.readyState == complete
第五步，HTML生命周期的第二步
window.onload被触发，标识加载完所有外部资源包括图片、样式
第六步，angular生命周期的第一步
constructor构造器，仅用来对局部变量进行简单值的初始化
第七步，angular生命周期的第二步
ngOnChanges，被绑定的输入值发生变化，出现在父子组件传值调用的情况，
第八步，angular生命周期的第三步
ngOnInit，一般在这里请求数据；ngDocheck，在每个变更检测周期中调用
第九步，angular生命周期的第四步
ngAfterContentInit，组件内容初始化后调用；ngAfterContentChecked，变更检测被调用
第十步，angular生命周期的第五步
ngAfterViewInit，初始化完成组件、视图后被调用，可进行DOM操作