面试题多着眼于框架原理、底层、概念解读,毕竟angular国内应用确实很少,大多用react。
- Angular 是什么?
答:
Angular 是由 Google 维护的一个开源前端框架,用于构建单页应用(SPA)。它使用 TypeScript 编写,提供组件化架构、依赖注入、响应式编程(RxJS)、模块化系统等特性。 - Angular 和 AngularJS 有什么区别?
答:
Angular(2+)是完全重写的框架,基于组件而非控制器。
使用 TypeScript 而非 JavaScript。
性能更好(如引入 Ivy 渲染引擎)。
支持服务端渲染(SSR)、PWA、模块懒加载等现代 Web 特性。
AngularJS(1.x)已停止维护。 - 什么是组件(Component)?
答:
组件是 Angular 应用的基本构建块,由 TypeScript 类(逻辑)、HTML 模板(视图)和可选的样式组成。通过装饰器 @Component 定义。 - 什么是模块(NgModule)?
答:
NgModule 用于组织相关组件、指令、管道和服务。每个 Angular 应用至少有一个根模块(AppModule),通过 @NgModule 装饰器配置 imports、declarations、providers 等。 - 组件间通信有哪些方式?
答:
父子通信:@Input()(父→子)、@Output() + EventEmitter(子→父)
任意组件:使用服务 + RxJS Subject家族
跨层级:@ViewChild / @ViewChildren(父访问子)、@ContentChild - 什么是服务(Service)和依赖注入(DI)?
答:
服务:用于封装可复用的业务逻辑(如 HTTP 请求、数据处理)。
依赖注入:Angular 的 DI 系统在运行时自动提供服务实例,通过构造函数注入,实现解耦和测试友好。 - Angular 中的生命周期钩子有哪些?
答:
常用钩子包括:
ngOnChanges:输入属性变化时调用
ngOnInit:组件初始化后调用(常用于数据获取)
ngDoCheck:自定义变更检测
ngAfterViewInit:视图初始化后
ngOnDestroy:组件销毁前(用于取消订阅、清理资源) - 变更检测(Change Detection)机制是什么?
答:
此题与“Angular的数据绑定原理”是一样的。
Angular 默认使用“脏检查”策略(从根组件向下检查所有绑定值是否变化)。可通过 OnPush 策略优化性能(仅当输入引用变化或事件触发时检测)。 - RxJS 在 Angular 中的作用?
答:
RxJS 提供 Observable 模式,用于处理异步操作(如 HTTP 请求、表单验证、事件流)。Angular 广泛使用 Observable 实现响应式编程。 - 如何优化 Angular 应用性能?
答:
使用 OnPush 变更检测策略(纯视图组件)
合理使用 trackBy 减少列表重绘
懒加载模块
避免在模板中使用复杂表达式或函数调用
使用 async 管道自动管理订阅
启用 AOT 编译和生产构建(ng build --prod) - 什么是管道(Pipe)?内置管道有哪些?
答:
管道用于转换数据(如日期、货币、大小写)。
内置管道:date、currency、uppercase、async、json 等。
可创建自定义管道(使用 @Pipe 装饰器)。 - Angular CLI 的作用?
答:
Angular CLI 是官方命令行工具,用于:
创建项目(ng new)
生成组件/服务/模块(ng generate)
运行开发服务器(ng serve)
构建生产包(ng build)
运行测试(ng test)
升级Angular (ng upgrade) - Ivy 渲染引擎是什么?
答:
Ivy 是 Angular 9+ 默认的编译和渲染引擎,特点包括:
更小的包体积
更快的编译速度
更好的调试体验
支持增量 DOM 更新 - 编译方式AOT,JIT的区别与应用
| 特性 | JIT(Just-in-Time) | AOT(Ahead-of-Time) |
|---|---|---|
| 编译时机 | 在浏览器中运行时编译(用户打开页面时) | 在构建阶段(ng build)就完成编译 |
| 是否需要编译器 | 需要将 Angular 编译器(约 1MB)打包进应用 | 不需要编译器,产物更小 |
| 首屏加载速度 | 较慢(需先下载编译器 + 编译模板) | 更快(直接执行预编译好的代码) |
| 错误检测 | 模板错误在运行时才暴露 | 模板错误在构建时就能发现 |
| 安全性 | HTML 模板以字符串形式存在,有潜在 XSS 风险 | 模板被编译为 JS,减少注入风险 |
| 适用场景 | 开发环境(ng serve 默认使用 JIT) |
生产环境(ng build --prod 默认使用 AOT) |
自 Angular 9 起,默认启用 Ivy 编译器,且开发模式也默认使用 AOT(通过增量编译实现快速热更新),但传统概念上仍保留 JIT/AOT 的区分
- onPush策略是什么
OnPush 是 Angular 中一种变更检测策略(Change Detection Strategy),与默认的变更检测策略(Default)有显著区别。
仅在以下情况触发:
- 输入属性(@Input())引用发生变化
- 组件内部事件(如按钮点击)
- 使用了 async 管道且 Observable 发出新值
- 手动调用 markForCheck()
正常在angular项目中,默认创建的组件是默认变更检测策略,因为对于Observable订阅,需要默认支持。
markForCheck比detectChange要更好,优先使用前者,实在需要强制刷新,如echarts则考虑后者。