（一）需求
【Day|Day 56/100 AngularJS 依赖注入】被问到AngularJS依赖注入的原理时，发现自己掌握的不好，于是总结记录下。
（二）依赖注入介绍
1、为什么要有依赖注入？
减少代码之间的耦合度，使代码有很强的可扩展性。
2、定义
- 模板功能强大丰富，并且是声明式的，自带了丰富的Angular指令；
- 是一个比较完善的前端MVC框架，包含模板，数据双向绑定，路由，模块化，服务，过滤器，依赖注入等所有功能；
- 依赖注入简化了组件之间处理依赖的过程（即解决依赖）。没有依赖注入，就不得不以某种方式自己查找$scope，很可能得使用全局变量。这虽然能够工作，但是不如AngularJS的依赖注入技术这么简单。
- 在开发中使用依赖注入的主要好处是AngularJS负责管理组件并在需要的时候提供给相应函数。依赖注入还能够为测试带来好处，因为它允许你使用假的或者模拟的对象来代替真实的组件，从而让开发者专注于程序的特定部分。
文章图片
依赖注入（Dependency Injection，简称DI）是一种软件设计模式，在这种模式下，一个或更多的依赖（或服务）被注入（或者通过引用传递）到一个独立的对象（或客户端）中，然后成为了该客户端状态的一部分。
该模式分离了客户端依赖本身行为的创建，这使得程序设计变得松耦合，并遵循了依赖反转和单一职责原则。与服务定位器模式形成直接对比的是，它允许客户端了解客户端如何使用该系统找到依赖
3、依赖注解如何使用？
什么时候使用？
在开发中就可以用的，尤其是有很多模块的页面中，为了实现mvc的思想，把各个部分抽离出来，单独写成一个angularjs依赖的组件，在使用的时候直接拿来用，当你的项目需要交接或者修改的时候，直接修改组件的内容就可以依赖注解使用有三种方式
(1)数组标注
someModule.controller('MyController', ['$scope', 'greeter', function($scope, greeter) {}]);
(2)添加$inject属性
var MyController = function($scope, greeter) {}MyController.$inject = ['$scope', 'greeter'];
someModule.controller('MyController', MyController);
(3)隐式声明
someModule.controller('MyController', function($scope, greeter) {});
使用场景
控制器中使用DI
someModule.controller('MyController', ['$scope', 'dep1', 'dep2', function($scope, dep1, dep2) {
...
$scope.aMethod = function() {
...
}
...
}]);
工厂方法中使用DI
angular.module('myModule', []).
config(['depProvider', function(depProvider){
...
}]).
factory('serviceId', ['depService', function(depService) {
...
}]).
directive('directiveName', ['depService', function(depService) {
...
}]).
filter('filterName', ['depService', function(depService) {
...
}]).
run(['depService', function(depService) {
...
}]);
参考链接
1、知乎 https://zhuanlan.zhihu.com/p/...
写在最后的话
1、我建了一个前端学习小组 感兴趣的伙伴，可以加我微信：learningisconnecting
2、学习路上，常常会懈怠 《有想学技术需要监督的同学嘛~》
https://mp.weixin.qq.com/s/Fy...
3、分享成长认知方法 欢迎关注我的公众号：国星聊成长
每周分享我学习到的成长/认知方法
