在 Angular 中，依赖注入（DI）是一个重要的特性，它让开发者很容易地管理对象的依赖关系，使得代码更加模块化和可测试。Angular 中的 DI 包含了两种方式：构造函数注入和属性注入。本文将详细讲解这两种方式的区别。
构造函数注入
构造函数注入是 Angular 中最常见的依赖注入方式。在一个组件或服务类中，我们会在构造函数的参数列表中声明需要依赖的服务或者其他对象。每当 Angular 需要实例化这个组件或服务时，就会根据参数类型和依赖提供者的配置来注入相应的依赖。
下面是一个例子，我们需要在一个组价中注入一个服务 MyService：
-- -------------------- ---- ------- ------ ----------- ---- ---------------- ------ ----------- ---- --------------- ------------ --------- ------------------- --------- ------ -- ------ ----- ----------- - ------------------- ---------- ---------- -- -
在上面的代码中，我们在 MyComponent 的构造函数中定义了一个参数 private myService: MyService。这样，当 MyComponent 被 Angular 实例化时，框架会通过 DI 机制使用 MyService 的提供者构造一个 myService 实例，并将其注入到构造函数中。
构造函数注入能够保证依赖的可靠性和完整性，因为我们必须在组件的构造函数中声明所有的依赖关系。此外，使用依赖注入的方式，我们可以很容易地 mock 出依赖对象，在单元测试中模拟一些复杂的场景。这使得我们能够独立地测试每个组件，并保障整个应用的质量。
属性注入
除了构造函数注入之外，Angular 中还提供了另一种注入依赖的方式：属性注入（使用 @Injectable 装饰器）。在属性注入中，我们需要在组件或服务类中的属性前使用 @Injectable 装饰器，以告诉框架注入相应的依赖。使用属性注入时，我们可以通过更加简洁的语法来访问依赖，而不需要在组件的构造函数中声明所有的依赖关系。
下面是一个使用属性注入的例子，我们需要注入一个服务 MyService：
-- -------------------- ---- ------- ------ ----------- ---- ---------------- ------ ------------ ---- ---------------- ------ ----------- ---- --------------- ------------- ------------ --------- ------------------- --------- ------ -- ------ ----- ----------- - ------------- -- ------------- ---------- ---------- -
在上面的代码中，我们在 MyComponent 中声明了一个 myService 属性，并且在这个属性前使用了 @Injectable 装饰器。由于我们已经在 @Injectable 中声明了 MyService 的提供者，Angular 会在组件或服务的实例化过程中，在 myService 中自动初始化一个 MyService 的实例。
使用属性注入的方式，我们可以访问到更加清晰的代码结构，使得代码更加易读。但使用属性注入也会带来一些副作用。使用属性注入时，我们很难知道一个组件需要的全部依赖关系。此外，在进行单元测试时，我们也很难 mock 出依赖对象，因为我们不能在测试源码前拦截 DI 机制的调用。因此，在开发过程中，我们应该尽可能地使用构造函数注入，只有在必要的情况下才使用属性注入。
总结
本文详细介绍了 Angular 中的两种依赖注入方式：构造函数注入和属性注入。两种方式都有自己的优缺点，需要根据具体的场景来决定使用哪种方式。在开发过程中，我们应该尽可能地使用构造函数注入，这样能够保证依赖的完整性和可靠性。使用依赖注入的方式我们还能轻轻松松地进行单元测试，并且保障整个应用的质量。希望本文对读者在 Angular 开发中的依赖注入有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64813e1948841e98940a96a4