您好,欢迎访问一九零五行业门户网

深度解析AngularJS依赖注入原理

本文主要为大家分享一篇深度解析angularjs依赖注入原理,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧。
依赖注入:dependency injection 简称di
例:
var xiaomi = new xiaomi(); // 假设小米公司生产了一台xiaomi手机 createshipment(xiaomi); //此方法能把货送给顾客,这叫做把小米手机注入到createshipment()方法
再假设createshipment()方法需要(手机,快递公司,订单详情)三个参数时,就需要:
var xiaomi = new xiaomi(); // 不仅要生产手机 var shipcompany = new shipcompany(); // 还要自己建立个快递公司 var order = new order(); // 还要自己建立线上线下平台做订单 createshipmentxiaomi,shipcompany,order); // 虽然小米已经这么干了,但还是很累的
上面的例子,小米除了在自己开的店里卖就没别的渠道了吗?不仅要做手机,还要自己接生意,还要自己做快递,不累吗?除了自己干,小米还能在淘宝,京东,苏宁等平台卖啊,还能利用三通一顺等快递公司来送货啊,这就是依赖注入要解决的问题。利用淘宝京东顺丰等公司就是给小米公司注入售卖服务(sellservice), 快递服务(sendservice) 等等!
控制反转:inversion of control 简称ioc
ioc是指将依赖的控制权从代码的内部转到代码的内部。好比小米把卖手机送货的权力给了外部,至于是淘宝在卖还是京东在卖,是圆通在送还是顺丰在送,这些都不用小米公司操心,小米公司只需要造手机就行了。专业的事交给专业的人去做。
ioc是一种松耦合的模式,实现的手段就是依赖注入。
注入器:
constructor(private someservice: someservice) {...}
这句话的意思是本组件声明了一个someservice的属性,指明它的类型是someservice,然后angular就会去提供器中去找someservice的一个实例,然后把这个实例注入给someservice。
提供器:
providers:[{provide:someservice,useclass:someservice}]
providers:[someservice]//provide跟useclass相同可简写为这个
例:
app.module.ts
@ngmodule({ providers:[{provide:sellservice,useclass:shunfengservice}], // 这个是淘宝,用的顺丰 // providers: [{provide:sellservice,useclass:yuantongservice}] // 这个是京东,用的圆通}) product.component.ts @component({ ... }) export class productcomponent implements oninit { product: product; constructor(sellservice: sellservice) { this.product = this.sellservice.sendproduct(); }}
上面的代码怎么理解呢?
小米声明sellservice对象(也是属性),叫sellservice去卖手机,sellservice呼叫售卖服务,这个服务是sellservice类型的(线上销售),那么angular就会去提供器里面找谁在提供这个售卖服务,至于是淘宝还是京东那要看提供器里面的,用的哪个快递公司就更加不需要小米公司来管了。angular找到sellservice之后会new一个shunfengservice的一个实例(找一家顺丰门店),找到之后把服务注入给小米公司的sellservice。sellservice就跑到那家顺丰门店填送货单(sendproduct方法)把手机送给客户了。
各位看官应该能想出更好的比喻,欢迎交流。如果有不妥之处欢迎指正。
相关推荐:
angularjs 依赖注入解析
angularjs中的依赖注入
30行代码让你理解angular依赖注入:angular 依赖注入原理
以上就是深度解析angularjs依赖注入原理的详细内容。
其它类似信息

推荐信息