Aprendizado angular fala sobre injeção de dependência

Injeção de Dependência (DI) em Angular

1. Visão Geral

A Injeção de Dependência (DI), conhecida como DI , é um设计原则em programação面向对象que é usado para reduzir o acoplamento entre códigos. [Recomendação de tutorial relacionado: "tutorial angular"]

class MailService {
  construtor(APIKEY) {}
}

classe EmailSender {
  mailService: MailService
  construtor() {
    this.mailService = novo MailService ("APIKEY1234567890")
  }

  sendMail(correio) {
    this.mailService.sendMail(mail)
  }
}

const emailSender = new EmailSender()
emailSender.sendMail(mail)

A classe EmailSender usa a classe MailService durante a execução. A classe EmailSender depende da classe MailService e a classe MailService é uma dependência da classe EmailSender.

O grau de acoplamento do método de escrita acima é muito alto e o código não é robusto. Se a classe MailService alterar a forma como os parâmetros são passados, o método de escrita na classe EmailSender também mudará.

classe EmailSender {
  mailService: MailService
  construtor(mailService: MailService) {
    this.mailService = mailService;
  }
}
const mailService = new MailService("APIKEY1234567890")
const emailSender = new EmailSender(mailService)

Ao instanciar a classe EmailSender, ele injeta suas dependências na classe por meio dos parâmetros do construtor construtor. Esta forma de escrever é a injeção de dependência.

A injeção de dependência reduz o acoplamento entre códigos e aumenta a capacidade de manutenção do código. As alterações de código na classe MailService não afetam mais a classe EmailSender.

2. Estrutura DI

Angular possui sua própria DI 框架, que隐藏o processo de implementação de injeção de dependência. Os desenvolvedores só precisam usar código muito simples para usar funções complexas de injeção de dependência.

Existem quatro conceitos principais na estrutura DI do Angular:

• Dependency : o objeto de instância do qual o componente depende, objeto de instância de serviço

• Token : obtém a identidade do objeto de instância de serviço

• Injector : o injetor, responsável por创建维护o objeto de instância do serviço classe e注入no componente Objeto de instância de serviço (gerencia a criação e aquisição de objetos de serviço).

• Provider : Configure o objeto do injetor, especifique a classe de serviço para criar o objeto de instância de serviço e obtenha o identificador do objeto de instância. (Provedor: Provedor)

2.1 Injetores

Os injetores são responsáveis ​​por criar objetos de instância de classe de serviço e injetar objetos de instância de classe de serviço nos componentes necessários.

• Crie uma

  importação de injetor {ReflectiveInjector} de "@angular/core"
  //Classe de serviço classe MailService {}
  //Crie o injetor e passe a classe de serviço const injector = ReflectiveInjector.resolveAndCreate([MailService])

• Obtenha o objeto da instância da classe de serviço no injetor

  const mailService = injector.get(MailService)

• O objeto da instância de serviço está no modo singleton e o injetor está em Depois que a instância de serviço for criada, ela será armazenada em cache

  const mailService1 = injector.get(MailService)
  const mailService2 = injector.get(MailService)
  
  console.log(mailService1 === mailService2) // verdadeiros

• injetores diferentes retornam objetos de instância de serviço diferentes

  const injector = ReflectiveInjector.resolveAndCreate([MailService])
  const childInjector = injector.resolveAndCreateChild([MailService])
  
  const mailService1 = injector.get(MailService)
  const mailService2 = childInjector.get(MailService)
  
  console.log(mailService1 === mailService2) // A busca por

• instâncias de serviço falsas é semelhante à作用域链da função. Se o nível atual puder ser encontrado, use o nível atual. pai para pesquisar

  const injector = ReflectiveInjector.resolveAndCreate([MailService])
  const childInjector = injector.resolveAndCreateChild([])
  
  const mailService1 = injector.get(MailService)
  const mailService2 = childInjector.get(MailService)
  
  console.log(mailService1 === mailService2) // true

2.2 O

• objeto injetor de configuração do Provedor especifica a classe de serviço para criar o objeto de instância e o identificador para acessar o objeto de instância de serviço.

  injetor const = ReflectiveInjector.resolveAndCreate([
    {forneça: MailService, useClass: MailService}
  ])

• O identificador para acessar o objeto dependente também pode ser uma string do tipo

  const injector = ReflectiveInjector.resolveAndCreate([
    {fornecer: "correio", useClass: MailService }
  ])
  const mailService = injector.get("mail")

• useValue

  const injector = ReflectiveInjector.resolveAndCreate([
    {
      fornecer: "Configuração",
      useValue: Object.freeze({
        APIKEY: "API1234567890",
        APISCRET: "500-400-300"
      })
    }
  ])
  const Config = injector.get("Config")

estabelece uma relação de acoplamento flexível entre o objeto de instância e a referência externa. O objeto externo obtém o objeto de instância por meio do identificador, desde que o identificador permaneça inalterado, não importa como o código interno. mudanças, não afetará o exterior.