El aprendizaje angular habla sobre la inyección de dependencia

Inyección de dependencia (DI) en Angular

1. Descripción general

La inyección de dependencia (DI), conocida como DI , es un设计原则en la programación面向对象que se utiliza para reducir el acoplamiento entre códigos. [Recomendación de tutorial relacionado: "tutorial angular"]

clase MailService {
  constructor(APIKEY) {}
}

clase Remitente de correo electrónico {
  servicio de correo: servicio de correo
  constructor() {
    this.mailService = nuevo servicio de correo ("APIKEY1234567890")
  }

  enviarcorreo(correo) {
    this.mailService.sendMail(correo)
  }
}

const emailSender = nuevo EmailSender()
emailSender.sendMail (correo)

La clase EmailSender usa la clase MailService cuando se ejecuta. La clase EmailSender depende de la clase MailService y la clase MailService es una dependencia de la clase EmailSender.

El grado de acoplamiento del método de escritura anterior es demasiado alto y el código no es robusto. Si la clase MailService cambia la forma en que se pasan los parámetros, el método de escritura en la clase EmailSender también cambiará.

clase Remitente de correo electrónico {
  servicio de correo: servicio de correo
  constructor (servicio de correo: servicio de correo) {
    this.mailService = servicio de correo;
  }
}
const mailService = nuevo MailService ("APIKEY1234567890")
const emailSender = new EmailSender (mailService)

Al crear una instancia de la clase EmailSender, inyecta sus dependencias en la clase a través de los parámetros del constructor. Esta forma de escribir es inyección de dependencia.

La inyección de dependencia reduce el acoplamiento entre códigos y aumenta la capacidad de mantenimiento del código. Los cambios de código en la clase MailService ya no afectan a la clase EmailSender.

2. Marco DI

Angular tiene su propio DI 框架, que隐藏el proceso de implementación de la inyección de dependencia. Los desarrolladores solo necesitan usar un código muy simple para usar funciones complejas de inyección de dependencia.

Hay cuatro conceptos centrales en el marco DI de Angular:

• Dependency : el objeto de instancia del que depende el componente, objeto de instancia de servicio

• Token : obtiene la identidad del objeto de instancia de servicio

• Injector : el inyector, responsable de创建维护el objeto de instancia del servicio clase e注入en el componente Objeto de instancia de servicio (gestiona la creación y adquisición de objetos de servicio).

• Provider : configure el objeto del inyector, especifique la clase de servicio para crear el objeto de instancia de servicio y obtenga el identificador del objeto de instancia. (Proveedor: Proveedor)

2.1 Inyectores

Los inyectores son responsables de crear objetos de instancia de clase de servicio e inyectar objetos de instancia de clase de servicio en los componentes requeridos.

• Cree una

  importación de inyector {ReflectiveInjector} desde "@angular/core"
  //clase de servicio clase MailService {}
  //Crea el inyector y pasa la clase de servicio const injector = reflectanteInjector.resolveAndCreate([MailService])

• Obtiene el objeto de instancia de clase de servicio en el inyector

  const mailService = injector.get(MailService)

• El objeto de instancia de servicio está en modo singleton y el inyector está en Después de crear la instancia de servicio, se almacenará en caché

  const mailService1 = injector.get(MailService)
  const mailService2 = inyector.get(Servicio de correo)
  
  console.log(mailService1 === mailService2) // verdaderos

• inyectores diferentes devuelven diferentes objetos de instancia de servicio

  const injector = reflectanteInjector.resolveAndCreate([MailService])
  const childInjector = inyector.resolveAndCreateChild([Servicio de correo])
  
  const mailService1 = inyector.get(MailService)
  const mailService2 = childInjector.get(MailService)
  
  console.log(mailService1 === mailService2) // La búsqueda de

• instancias de servicio falsas es similar a la作用域链de función. Si se puede encontrar el nivel actual, use el nivel actual. Si no se puede encontrar el nivel actual, vaya a. padre para buscar

  inyector constante = reflectanteInjector.resolveAndCreate([ MailService])
  const childInjector = inyector.resolveAndCreateChild([])
  
  const mailService1 = inyector.get(MailService)
  const mailService2 = childInjector.get(MailService)
  
  console.log(mailService1 === mailService2) // true

2.2 El

• objeto inyector de configuración del proveedor especifica la clase de servicio para crear el objeto de instancia y el identificador para acceder al objeto de instancia de servicio.

  inyector constante = ReflectanteInjector.resolveAndCreate([
    {proporcionar: MailService, useClass: MailService}
  ])

• El identificador para acceder al objeto dependiente también puede ser un tipo de cadena

  const injector = reflectanteInjector.resolveAndCreate([
    { proporcionar: "correo", useClass: MailService }
  ])
  const mailService = injector.get("correo")

• useValue

  const injector = reflexivoInjector.resolveAndCreate([
    {
      proporcionar: "Configuración",
      useValue: Objeto.freeze({
        APIKEY: "API1234567890",
        APISCRETO: "500-400-300"
      })
    }
  ])
  const Config = injector.get("Config")

establece una relación de acoplamiento flexible entre el objeto de instancia y la referencia externa. Siempre que el identificador permanezca sin cambios, el objeto externo obtiene el objeto de instancia a través del identificador. cambios, no afectará el exterior.