AngularJS 是一款流行的前端 JavaScript 框架，它提供了许多强大的功能，其中服务注入是其重要特性之一。通过服务注入，我们可以实现模块化并解耦代码，同时方便地与其他组件交互，提升应用程序的可维护性和扩展性。本文将详细介绍 AngularJS 服务注入的使用，包括常见的服务类型、注入方式和使用示例。
服务类型
在 AngularJS 中，服务是指提供一组功能的 JavaScript 对象，可以用于处理各种任务，如数据获取、验证、缓存、日志等。AngularJS 内置了许多常用服务，比如 $http、$location、$timeout 等，它们实现了很多复杂的底层逻辑，供我们直接使用。另外，还可以自定义服务，用于实现特定的业务需求，提高开发效率和代码可读性。
常见的服务类型有：
- 值（Value）服务：提供简单的数据值，通常用于存储全局配置等常量。
- 常量（Constant）服务：与值服务类似，但无法在运行时修改。
- 工厂（Factory）服务：提供一组用于创建对象的函数，通常用于封装创建对象的复杂逻辑。
- 服务（Service）服务：与工厂服务类似，但其创建的对象是单例的，常用于提供全局服务。
- 提供者（Provider）服务：是工厂和服务服务的抽象，并提供了更复杂的配置选项，慕课网上的课程中也有详细讲解。
注入方式
为了使用服务，我们需要先将其注入到需要的组件中。在 AngularJS 中，可以通过以下方式实现：
$injector.get('serviceName')：使用$injector对象的get方法，传入服务名称即可获取对应的服务实例。- 内联数组注释：在依赖组件的声明中使用内联数组注释，即
[serviceName, function(serviceInstance){...}]的方式，其中第一个字符串表示需要注入的服务名称，第二个参数为一个函数，用于处理服务实例，函数中的参数即为注入的服务实例。 - 显式注入（推荐）：在依赖组件的声明中，直接声明需要注入的服务，即
function(serviceInstance){...}中的参数即为注入的服务实例。
推荐使用显式注入的方式，如下所示：
angular.module('myApp', [])
.controller('MyCtrl', MyCtrl);
MyCtrl.$inject = ['myService'];
function MyCtrl(myService) {
// 进行操作，myService 即为注入的服务实例
}使用示例
下面我们来看一个最简单的服务注入示例，使用内置的 $timeout 服务实现计时器功能。
-- -------------------- ---- -------
----------------------- ---
------------------------ ----------
----------------- -------
------------- - -------------
-------- --------------- - -- ----
------ ------------------ --------- -
--- ----- - ---------- -
-----------
-------------- - --------------- ----------
--
-------------- - --------------- ----------
------ ------
--
-
----------------- - ----------
-------- ---------------- - -- ---
--- -- - -----
------- - --
-------- - ---------- -
-- ---------- -
-----------
-
-------- - --- ---------------- -
------- -- --
-- ------
--
------- - ---------- -
-- ---------- -
---------------------------
-------- - -----
-
--
-在上面的代码中，我们定义了一个名为 Timer 的工厂服务，其返回值是一个用于定时执行回调函数的函数。在 TimerCtrl 控制器中，我们注入了 Timer 服务，并通过调用 Timer 函数创建了一个计时器。
注意，这里我们使用了显式注入的方式，即将需要注入的服务名称作为参数声明在函数中。这种方式使得代码更加明确且易于测试，推荐使用。
总结
通过本文，我们了解了 AngularJS 服务注入的常见类型、注入方式和使用示例。其中，服务是 AngularJS 开发中很重要的概念，通过服务注入实现模块化，可以方便地扩展和维护代码。同时，我们还进一步掌握了基础的 AngularJS 开发技巧，相信可以对我们的前端开发工作有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/651a714795b1f8cacd25fffd