AngularJS 的依赖注入（Dependency Injection，简称 DI）是其核心特性之一，它通过一种优雅的方式解决了模块间依赖关系的管理问题，使得代码更加模块化、可测试和可维护，深入理解其注入原理，有助于开发者更好地使用 AngularJS 构建复杂应用。
依赖注入的基本概念
依赖注入是一种设计模式，其核心思想是：将组件所需的依赖（如服务、工具类等）从外部传递给组件，而不是让组件内部自行创建，这种模式的好处在于，它降低了组件间的耦合度，使得组件更加独立，一个控制器可能需要一个 $http 服务来发起 HTTP 请求，在 DI 模式下，开发者无需在控制器内部 new 一个 $http 实例，而是通过声明的方式告诉 AngularJS：“我需要 $http”，AngularJS 会自动将 $http 实例注入到控制器中。
AngularJS 注入器的核心角色
AngularJS 中，依赖注入的实现离不开一个关键角色——注入器（Injector），注入器是 AngularJS 的核心服务，它负责管理所有可用的依赖，并在需要时将它们注入到相应的组件中，当 AngularJS 应用启动时，会创建一个根注入器（Root Injector）,这个注入器会递归地创建并注册所有被声明的模块及其依赖。
注入器维护了一个依赖项的注册表，当某个组件声明了对某个依赖的“需求”时，注入器会根据依赖的名称去查找对应的依赖提供者（Provider），然后通过提供者创建依赖实例,并最终注入到组件中。
依赖的声明方式：$inject
在 AngularJS 中，开发者可以通过多种方式告诉注入器某个组件需要哪些依赖，最传统的方式是使用 $inject 属性。$inject 是一个数组,数组的元素依次对应函数参数中所需的依赖名称。
myApp.controller('MyController', ['$scope', '$http', function($scope, $http) {
// 控制器逻辑
}]);或者：
var MyController = function($scope, $http) {
// 控制器逻辑
};
MyController.$inject = ['$scope', '$http'];
myApp.controller('MyController', MyController);使用 $inject 数组的好处是，即使代码被压缩（变量名被缩短），注入器也能正确识别依赖项,因为依赖名称是以字符串形式声明的。
函数参数推断
为了简化代码，AngularJS 提供了一种更便捷的依赖声明方式——函数参数推断，注入器会分析函数的参数名称,并将这些参数名称作为依赖项的名称去查找对应的依赖。
myApp.controller('MyController', function($scope, $http) {
// 控制器逻辑
});这种方式非常简洁，但在生产环境中存在风险，因为当代码被压缩工具（如 UglifyJS）处理时，函数参数名会被缩短（如 $scope 变成 a，$http 变成 b），导致注入器无法正确识别依赖项，从而引发错误，对于需要发布到生产环境的代码，推荐使用 $inject 数组或内联数组注解（即第一种方式）。
依赖提供者（Provider）
注入器如何知道如何创建依赖实例呢？这就涉及到依赖提供者（Provider）的概念，提供者是注入器的配置项，它告诉注入器如何创建和配置一个依赖，在 AngularJS 中，几乎所有内置服务（如 $http、$route）都有对应的提供者。
提供者通常以 Provider 例如 $httpProvider 负责配置 $http 服务，开发者可以通过配置提供者来定制服务的行为，可以通过 $httpProvider 的 interceptors 数组添加拦截器，对 HTTP 请求和响应进行统一处理。
| 服务名称 | 提供者名称 | 用途 |
|---|---|---|
| $http | $httpProvider | 发起 HTTP 请求 |
| $route | $routeProvider | 配置路由规则 |
| $log | $logProvider | 提供日志功能 |
| $cacheFactory | $cacheFactoryProvider | 创建缓存 |
依赖注入的流程
当一个组件（如控制器、指令、服务等）被创建时,依赖注入的流程大致如下：
- 声明依赖：组件通过 $inject 数组、函数参数推断或内联数组注解声明其所需的依赖。
- 查询注入器：AngularJS 调用根注入器或当前组件的子注入器,传入依赖名称列表。
- 查找提供者：注入器根据依赖名称查找对应的提供者。
- 实例化依赖：如果找到提供者，注入器调用提供者的
$get方法（这是创建服务实例的核心方法）来创建依赖实例，如果依赖实例尚未创建，则创建并缓存；如果已创建,则直接返回缓存的实例。 - 注入依赖：将创建好的依赖实例按顺序传递给组件的构造函数或工厂函数。
AngularJS 的依赖注入机制通过注入器、提供者和多种依赖声明方式，实现了依赖的自动管理和注入，它不仅简化了开发者的编码工作，更重要的是，它遵循了“控制反转”（Inversion of Control）和“单一职责”原则，使得代码结构更清晰，模块间耦合度更低，从而极大地提高了应用的可测试性和可维护性，理解其背后的原理，有助于开发者更有效地利用 AngularJS 的强大功能，构建高质量的 Web 应用。
图片来源于AI模型，如侵权请联系管理员。作者：酷小编，如若转载，请注明出处：https://www.kufanyun.com/ask/33311.html
