如何雇用Angular开发人员:需要寻找的关键技能和知识

许多正在寻找下一份工作的开发人员声称他们有使用谷歌流行的前端框架的经验。在这里，国际Angular教练Bo Vandersteene告诉招聘经理如何将最好的人与其他人分开。

凭借其高度可扩展的架构，许多Web开发团队选择Angular来创建高效、复杂的单页应用程序。但是，雇用Angular开发人员说起来容易做起来难。虽然有很多候选人，但无缝开发经验的关键是找到一个伟大的Angular开发人员，一个应用最佳实践和先进技术以满足高质量编码标准的人。

了解关于谷歌流行的前端框架的关键概念，将使你准备好自信地面试潜在客户并雇用最高水平的开发人员--那些努力将代码库带到新水平的人。本文阐述了一个优秀的Angular专业人员应该具备的关键技能和知识。

TL;DR

高质量的Angular候选人将是那些:

• 了解Angular的核心功能。
• 在开始写代码之前先进行设计。
• 理解Angular应用的生命周期。
• 对反应式编程有扎实的了解。
• 知道什么是状态以及如何使用它。
• 熟练掌握并支持自动化测试。
• 对最新的Angular版本保持了解。

了解Angular的核心功能

Angular框架在TypeScript上运行，所有写在应用程序内部的代码都被转译成JavaScript。TypeScript是JavaScript的超集，可编译为普通的JavaScript。Angular代码就是由这个超集表示的。

很多开发者学习Angular，但对JavaScript、TypeScript、HTML或CSS所要求的核心概念缺乏良好的理解。如果缺少这些基础，开发人员很容易使用不恰当的变通方法，从而使项目的技术债务成倍增加。

所以，要问候选人是否有HTML5和CSS3的知识。一个好的Angular开发者不需要是HTML或CSS专家，只要团队中有人是，但他们应该了解这些关键概念:

• Flexbox
• SCSS变量
• span 和 之间的区别div
• CSS中的重要类
• 属性

编码前的设计

好的设计是好的应用架构的关键。询问你的候选人他们是如何进行设计的，并将他们的想法与这些理想的考虑因素进行比较:

• 代码将被放在哪里？是否需要一个新的库或一个模块？
• 输入和输出是什么？
• 是否应该有任何可重复使用的组件或指令？
• 状态将去哪里？（在下面的状态管理中进一步讨论）。
• 业务逻辑将去哪里--即在哪个服务中？
• 某些组件是否可以在库之间共享，以便从本质上创建一个UI设计系统？

一个特定设计的全部细节并不重要，重要的是候选人是否有做设计的习惯。所有的设计都是临时性的，所以，对于大多数应用来说，除非需要正式的文档，否则文档可以简单到像白板上的草图照片一样。在以后的阶段，开发者可以从代码中生成技术设计（使用合适的工具），以明确所有的部分是如何相互关联的。

了解Angular应用程序的生命周期

询问你的候选人，他们对Angular组件的生命周期了解多少。他们的回答应该包括三个生命周期的钩子。ngOnInit,ngOnChanges, 和ngOnDestroy 。正如名字所示，ngOnInit 在组件初始化时被调用，ngOnDestroy 在组件被销毁时被调用，ngOnChanges 在属性改变时被调用。后者可能发生在ngOnInit之前--当属性在组件完全初始化之前已经被分配，那么ngOnChanges 就会在ngOnInit 之前执行。

如果候选人也知道ngDoCheck 、ngAfterContentInit 、ngAfterContentChecked 、ngAfterViewInit 、ngAfterViewChecked ，那么他们就知道所有组件的变化检测钩子，并领先一步。

对于任何一个钩子，都可以问一个好的后续问题。"这个变化检测是什么时候发生的？"

Angular组件生命周期的概述。

一个不太知名的生命周期是提供者的生命周期，它只有一个钩子：ngOnDestroy 。只有当提供者被附在组件级别时才会被调用，在这种情况下它会和组件一起被销毁。如果它是在根或模块级别上提供的，它将永远不会被销毁。

提供者的构造函数将在第一次使用提供者时被执行，所以构造函数有可能永远不会被执行。就这种可能性询问你的候选人--在现实世界中，这可能是一个经常被忽视的错误源头。

反应式编程的坚实知识

在Angular应用程序中，反应式编程往往是最难理解的部分。许多人在开始对一段代码进行编程时，会以程序性的方式思考，认为它更容易理解和操作，就像菜谱的步骤一样。

反应式编程涉及对我们无法控制的事情做出反应，而且这些事情可能以不可预测的顺序发生。尽管我们每天都在以这种方式对事物做出反应--例如，当我们前面的汽车突然停下时，我们会刹车--但许多开发者发现很难采取反应式编程的方法。

但是，在Angular应用程序中发生的所有事情都是基于反应式编程的。例如，在Angular购物应用程序中，一些反应性的例子可能包括:

• 当用户登录时，购物车图标上的数字会更新，而菜单项目会变成更具体的选项。
• 当用户浏览到一个类别时，产品会根据所选择的类别进行更新。
• 当用户将产品添加到他们的购物车时，购物车图标会随着产品的数量而更新。
• 当一个商品缺货时（通过监听器从后端监测当前的库存数量来注册），页面UI会更新。

请注意，这些事情是自动发生的，不需要刷新页面就能出现。在面试中，请应聘者描述他们如何在自己开发的应用程序中应用反应式编程。如果应聘者描述的解决方案涉及刷新页面或手动调用ChangeDetectorRef.detectChanges() 来刷新一个组件，那么这就是一个黄旗。

在Angular中使用Observables的误区

经验不足的开发者有时会发现，他们在Angular应用程序中编写的代码没有被执行。经验丰富的Angular开发者可以找出一个常见的原因。Observable 上没有订阅，这是反应式编程中的主流对象类型。只有在订阅的情况下，后端调用或其他反应才能被执行。

有两种方法来创建订阅。开发人员可以使用async 管道或subscribe 方法。但有一个注意事项：如果开发者进行手动订阅（用subscribe 方法），Observable 将需要手动销毁（尽管有一些边缘案例，它默认发生）。开发人员可以通过多种方式销毁Observables:

• 在可能的情况下，使用async 管道（当不再需要该组件时，这将销毁Observable ）。
• 在组件的生命周期结束时，通过在Observable 上使用unsubscribe 方法手动取消订阅(ngOnDestroy)。
• 以一种更加声明性的方式，在pipe 操作符内使用takeUntil 操作符，并使用一个主题（即类似于destroy$ 的东西命名）。在这种情况下，主体在组件的生命周期结束时发出destroy$.next() (ngOnDestroy)。在收到destroy事件后，takeUntil 操作者将不再接受来自它所绑定的Observable的事件，这样它的订阅者逻辑将不再被触发。对于一个例子，请参阅第2节中的takeUntil操作符。类似的功能可以通过take 和takeWhile 操作符来暴露。
• 自从Angular应用程序切换到Ivy编译器后，我们也可以使用注解。 until-destroy 库或另一个第三方库（如SubSink）可以用来在组件被销毁后顺利地取消对观察变量的订阅。

反应式编程的另一个潜在痛点来自于内存泄漏和对后端的多次调用。询问候选人是否意识到这些问题，以及他们通常会如何解决这些问题。如上所述，由于未能从Observables中取消订阅，就会发生内存泄漏。因为在后端调用多个订阅而多次调用后端，可以通过共享Observable 来解决。

了解状态和如何使用它

所有的单页应用程序都有一个状态，这个状态在前端的某个地方是可用的。但究竟什么是状态呢？它包含所有特定于当前用户体验的变量。例如，认证的用户细节，如姓名和个人资料图片的URL，选择的特定菜单项，或屏幕上的列表，如购物车项目的列表。

在Angular应用程序中，有三种主要类型的前端状态需要考虑:

状态	范围
应用程序	整个应用程序可用的一般信息，如认证的用户、用户角色、菜单项或用户的购物篮。这个状态下的任何变化都会对整个应用产生影响。
模块	对使用服务的整个模块可用的信息。每次开发人员重复使用带有提供者的模块时，都会为每个提供者创建一个新的实例。该状态永远不会被销毁，只有在第一次使用某个提供者时才会被创建。
组件	对某一组件可用的信息。组件是一个应用程序的最小部分。一个Angular应用程序可以有多个组件状态，但它们只能通过每个组件访问。状态将在组件创建时被创建，并在组件被销毁时被销毁。

对什么是状态，以及什么时候应该加载或重新加载状态有很好的理解，是雇用Angular开发者时需要寻找的关键技能之一。如果你的团队有机会审查应聘者写的一些示例代码，这是可以探索的主要领域。如果应聘者使用的是状态管理库:

• 看看是否使用了NgRx、Akita、NgXs或类似的状态管理专用库。
• 然后看一下相关代码中是否有effects 、action 、reducer 、store 、selector 的通知。

让我们以NgRx中应用程序状态的一般流程为例（与Akita和其他库的流程类似）:

如果开发者用服务创建自己的状态，他们在状态管理方面的能力可能更难识别。

• 搜索对state 或effect 等词的引用。
• 看看代码是否对某些动作做出了反应，例如，如果用户按下按钮A，屏幕B上的文字应该改变。

面试官要问的关于状态的问题

你不可能总是通过调查申请人的代码来发现你需要知道的一切。将这些问题添加到你的问题列表中，以调查潜在的Angular开发人员对状态的理解程度。

• 你在哪里使用过state- 以及如何使用？这是了解他们对状态的经验的一个坚实的起点；不要害怕探究具体细节。
• 你是如何决定是否使用一个库的？如果他们知道在一个应用程序中包含一个状态库并不总是有用的，这是个好兆头。
• 你会把什么放在状态里面，你会把它放在哪里，你是如何利用状态管理系统的？如果他们说："我把所有东西都放进我的全局应用状态中"，这肯定是一个信号，说明开发者没有意识到这样的系统会给应用带来的负面效应。

了解各种状态类型的开发者会避免这些副作用:

• 只适用于一个组件的状态可能被其他组件修改或破坏。
• 数据被嵌套在存储中，所以变得很难跟踪数据，而且数据变得人无法阅读（为了调试、数据交换等目的）。
• 在表单内编辑数据已经将其发射到应用程序的其他部分，而它只应该在保存数据时被推送到存储区--换句话说，应用程序的其他部分可能正在消耗无效的数据。

不用多久，全局存储就会变成一个无序的混乱，而且不清楚混乱的每一部分的来源，使其更难调试和维护。

了解自动测试的重要性

对于任何Angular网络应用来说，自动测试应该被认为与代码质量一样重要。程序员写测试的主要原因之一是为了记录他们的代码。如果一个新的开发人员加入公司，根据测试套件的预期，业务逻辑和某些UI流程应该是清晰的。另外，自动化测试可以在开发的早期发现错误。

向你的潜在Angular开发人员询问三个测试问题:

• 你对测试有什么看法？任何不关心自动化测试的候选人都应该停止考虑。即使他们不愿意使用测试驱动开发（TDD），那些没有看到自动化测试价值的开发者也会让你的公司付出人工测试的时间，更糟糕的是，当应用程序随着时间推移而出现退步时，终端用户的停机时间。
• 你在测试时关注什么？一个优秀的Angular开发者应该专注于测试核心业务逻辑，而不是测试基本的假设，比如能够给一个字段赋值，或者争取特定的测试覆盖率指标（即85%的覆盖率）。
• 通常是E2E测试多还是单元测试多？为什么？作为前端应用程序，Angular应用程序可以利用两种主要的自动化测试：单元测试和端到端（E2E）测试。通常情况下，一个测试套件会有很多单元测试和较少的E2E测试。单元测试很小，所以它们的编写和执行都很迅速。E2E测试更大，速度更慢。公平的警告。不是所有的开发者都对单元测试和E2E测试的正确比例有相同的看法。实际上，这取决于被测试的应用程序的复杂性，即使如此，答案在某种程度上也是值得商榷的。

Angular开发者的测试面试问题指南。

Angular测试框架

当涉及到自动化测试框架时，Angular开发人员有选择。单元测试可以通过Jest或Jasmine和Karma进行。每个Angular开发者都应该熟悉Jasmine和Karma。Jest也很常见--它通常更快，并具有更多高级测试选项。

Angular应用程序的E2E测试标准是Protractor，这是Angular CLI生成的默认工具。另一个选择是Cypress，这是一个很有前途的E2E测试框架，有很多选项。

要确保候选人至少对一个单元测试框架和一个E2E测试框架有深入了解。

保持对Angular最新发布信息的了解

优秀的Angular开发者可能由于各种原因，在开发中不总是使用最新的版本，但他们应该知道Angular的发布时间表，这样他们就能及时了解变化，并做好转换的准备。评估的方法之一是询问候选人是否熟悉Angular的发布策略。Angular的目标是每六个月发布一个主要版本，通常在二月和五月左右。一个Angular版本在其发布日期后的前六个月处于 "积极支持 "状态，而在其发布日期后的12个月内处于 "长期支持 "状态。与其他一些技术相比，这是一个相当紧凑的时间表，因此，保持最新状态尤为重要。

你也可以对Angular的最新版本做一些研究，并询问你的候选人这些新功能的好处。例如，在Angular 14发布的前后，你可能会问候选人有关。

• 独立组件，它减少了对Angular模块的需求。独立组件没有在任何现有的NgModule ，它们直接管理自己的依赖关系。因此，它们可以直接被依赖，而不需要中间的NgModule 。
• 类型化表单，这是Angular 14的另一个重大更新，它将严格的类型化设定为Angular Reactive表单的默认值。类型化表单确保FormControls 、FormGroups 、FormArrays 内的值在整个API表面都是类型安全的。这使得表单更加安全，特别是对于深度嵌套的复杂情况。

为你的前端团队提供下一个伟大的Angular开发者

每个Web开发项目和团队都是不同的，对Angular开发人员的技能和知识的各个方面都会有不同的重视。但是，了解我们在这里介绍的基础性话题，将使招聘经理能够有意义地参与招聘--甚至是更多的技术评估。

了解基础知识

为什么要雇用Angular开发人员？

Angular是一个流行的基于TypeScript的框架，正在获得牵引力。如果你想建立一个具有吸引人的用户体验的专业网络应用，你可能想选择一个Angular开发者。

Angular开发者的角色是什么？

一个Angular开发人员，在他们的核心，是一个专门的网络前端开发人员。他们将执行一些任务，如构建应用程序的用户界面，处理API，与后端工程师合作，并编写单元测试。

Angular开发人员的需求量大吗？

JavaScript和TypeScript在整个网络应用中被普遍使用，而Angular框架的需求量尤其大。因此，Angular开发人员非常抢手。

怎样才能成为一名优秀的Angular开发者？

一个优秀的Angular开发者需要了解各种主题，包括Angular基础（如TypeScript基础）、组件生命周期、可观察性、状态管理和测试。