> 웹 프론트엔드 > JS 튜토리얼 > AngularJS 종속성 주입 원칙에 대한 심층 분석

AngularJS 종속성 주입 원칙에 대한 심층 분석

零到壹度
풀어 주다: 2018-03-28 15:06:35
원래의
3200명이 탐색했습니다.

이 기사는 주로 AngularJS 종속성 주입 원리에 대한 심층 분석을 공유하며 좋은 참고 가치가 있으며 모든 사람에게 도움이 되기를 바랍니다. 편집자를 따라가서 살펴보겠습니다.

종속성 주입: 종속성 주입 약어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);   // 虽然小米已经这么干了,但还是很累的
로그인 후 복사

위의 예에서 Xiaomi는 자체 매장에서 판매하는 것 외에 다른 채널이 없나요? 휴대폰도 만들어야 하고, 업무도 처리해야 하고, 택배도 해야 하니 피곤하지 않으신가요? Xiaomi는 자체적으로 이를 수행하는 것 외에도 Taobao, JD.com, Suning 및 기타 플랫폼에서 판매할 수 있으며 Santong Yishun과 같은 특송 회사를 사용하여 상품을 배송할 수도 있습니다. 이는 종속성 주입이 해결해야 할 문제입니다. Taobao, JD.com, SF Express 및 기타 회사를 이용하는 것은 판매 서비스(sellService), 특급 배송 서비스(sendService) 등을 Xiaomi에 주입하는 것입니다!

제어 반전: 제어 반전 약어IOC

IOC은 종속성 제어를 코드 내부에서 코드 내부로 전송하는 것을 의미합니다. 예를 들어, 샤오미는 외부인에게 휴대폰을 판매하고 배달할 수 있는 권한을 부여했습니다. 타오바오가 팔든, JD.com이 팔든, YTO가 배달하든, SF 익스프레스가 배달하든, 샤오미는 이것들만 걱정할 필요가 없습니다. 휴대폰. 전문적인 문제는 전문가에게 맡기세요.

IOC은 느슨한 결합 모드이며 구현 수단은 종속성 주입입니다.

인젝터:

constructor(privatesomeService : SomeService) {...}

이 문장은 이 구성 요소가 someService 속성을 선언하여 해당 유형이 SomeService임을 나타내고 angular가 공급자에게 가서 SomeService을 찾기 위해 , 그런 다음 이 인스턴스를 someService에 삽입합니다.

提供器:

providers:[{provide:SomeService,useClass:SomeService}]

providers:[SomeService]//provideuseClass相同可简写为这个

例:

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的一个实例(找一家顺丰门店),找到之后把服务注入给小米公司的sellServicesellService就跑到那家顺丰门店填送货单(sendProduct方法)把手机送给客户了。

各位看官应该能想出更好的比喻,欢迎交流。如果有不妥之处欢迎指正。

相关推荐:

AngularJS 依赖注入解析

AngularJS中的依赖注入

30行代码让你理解angular依赖注入:angular 依赖注入原理

위 내용은 AngularJS 종속성 주입 원칙에 대한 심층 분석의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿