4.1本章简介
第三章 Angular Route导航 我们学了路由的相关知识，这一章将继续开发在线竞拍程序 ，并把精力集中在如何使用angular处理对象的过程，也就是依赖注入 （Dependency Injection 简称DI）。
本章的学习内容
- 什么是依赖注入模式及使用依赖注入的好处
- 介绍Angular的依赖注入实现：注入器和提供器
- 注入器的层级关系
4.2依赖注入的好处
4.2.1、了解依赖注入的好处之前先要知道依赖注入要解决的问题：
假设你写了一个方法，方法的参数是一个对象，当你调用这个方法时，需要实例化这个对象并把它传递给方法，假设在线竞拍程序有个发货中心负责把你买到的商品发给你，程序中我们可能会编写这样的代码：
var product = new Product();
createShipment(product);
如果我们调用的对象需要三个参数，比如发货时的商品信息、快递公司信息、订单的信息，每个对象又有自己的依赖（比如订单信息里面又有地址信息对象），那代码就可能变成这样：
var product = new Product();'
var shipCompany = new shipVompany();
var address = new Address();
var order = new Order();
order.setAddress(address);
createShipment(product, shipCompany, order)
这个过程有大量的实例化对象代码，能不能找一个某人来替我们创建这些实例化代码依赖的对象以及对象依赖的对象，使得我们使用的时候只需要写最后一句？
如果一个对象A要依赖类型为B的这样一个对象，那么对象A不需要明确地去实例化B，B由外部机制注入进来，对象A只需要声明我需要一个B类型的对象，有人能给我一个吗？
这就是依赖注入模式要解决的问题。
4.2.2、控制反转
与依赖注入同时出现的另一个概念叫做控制反转：Inversion of Control 简称IOC。控制反转和依赖注入是一体两面，表达的是一个思想。
控制反转侧重于描述目的：如何将依赖的控制权从代码的内部转到代码的外部；
依赖注入侧重于描述手段：如何实现控制反转。
实现了依赖注入模式的框架被称为IOC容器，Angular框架就是一个IOC容器，Angular实现控制反转的手段就是依赖注入。
这里描述了一些概念，比较难理解，需要一些面向对象的思想，后面可以慢慢的理解。
控制反转是指将依赖的控制权从代码的内部转到代码的外部，比如4.2.1中的代码对代码的依赖是由代码的内部所决定的。
4.2.3、使用依赖注入模式的好处
简单来说依赖注入会帮助你以松耦合的方式来编写代码，让你的代码可测性和可重用性更高。
@NgModule({
providers: [productService], //1、在Angular中根据指定providers来告诉Angular哪些对象需要依赖注入
...省略其他配置
})
export class AppModule{ }
@Component({
...省略其他配置
})
export class ProductComponent{
product: Product;
constructor(productService: ProductService){ //2、声明自己需要一个类型为ProductService的token
this.product = productService.getProduct();
}
}
providers: [productService] 等价于 providers：[{provcide: ProductService, userClass: ProductService}]
这里涉及Angular的一个概念：token，一个token代表一个被注入的对象的类型，token的类型由provider配置对象的provide属性来决定。所以这段代码的意思是，注册一个类型是ProductService的token，当有组件或指令声明自己需要一个类型为ProductService的token时，实例化一个ProductService并将其注入到对象。
用它的构造函数声明自己需要一个类型为ProductService的token，Angular框架看到构造函数的声明后，会在providers里面去找这个类型的token所对应的类，这里写的是ProductService，所以会实例化一个ProductService到构造函数赋并值给productService，
如果你想在其他项目中重用ProductComponent组件，而另一个项目中有另一个实现了ProductService的类，那你可以修改那个项目的AppModule的providers声明，修改为：
providers：[{provcide: ProductService, userClass: AnotherProductService}]
这样ProductComponent本身就不需要做任何更改。也消除了Product和ProductService的紧耦合，提高了ProductComponent组件的重用性。
网友评论