Pembelajaran sudut bercakap tentang suntikan pergantungan

Apakah suntikan pergantungan? Artikel ini akan membawa anda melalui suntikan pergantungan (DI) dalam sudut dan memperkenalkan secara terperinci dua konsep teras rangka kerja AngularDI: penyuntik dan pembekal saya harap ia akan membantu anda!

Suntikan Kebergantungan (DI) dalam sudut

Ikhtisar

Suntikan Ketergantungan (Dependency Injection), dirujuk sebagai DI, ialah sejenis pengaturcaraan 面向对象 yang digunakan untuk mengurangkan 设计原则darjah gandingan antara kod. [Cadangan tutorial berkaitan: "tutorial sudut"]

class MailService {
  constructor(APIKEY) {}
}

class EmailSender {
  mailService: MailService
  constructor() {
    this.mailService = new MailService("APIKEY1234567890")
  }

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

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

Kelas EmailSender perlu menggunakan kelas MailService apabila dijalankan Kelas EmailSender bergantung pada kelas MailService dan kelas MailService adalah kebergantungan kelas EmailSender.

Tahap gandingan kaedah penulisan di atas terlalu tinggi dan kodnya tidak mantap. Jika kelas MailService mengubah cara parameter dihantar, kaedah penulisan dalam kelas EmailSender juga akan berubah.

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

Apabila membuat instance kelas EmailSender, masukkan kebergantungannya ke bahagian dalam kelas melalui parameter pembina pembina Cara penulisan ini ialah suntikan pergantungan.

Melalui suntikan pergantungan, gandingan antara kod dikurangkan dan kebolehselenggaraan kod ditingkatkan. Perubahan kod dalam kelas MailService tidak lagi menjejaskan kelas EmailSender.

2. Rangka kerja DI

Angular mempunyai

sendiri, yang akan melaksanakan proses suntikan pergantungan DI 框架, untuk pembangunan Untuk pembangun, anda boleh menggunakan fungsi suntikan kebergantungan yang kompleks dengan kod yang sangat mudah. 隐藏

Terdapat empat konsep teras dalam rangka kerja DI Angular:

• : objek contoh yang komponen bergantung, objek contoh perkhidmatan Dependency

• : Dapatkan identiti objek contoh perkhidmatan Token

• : Penyuntik, bertanggungjawab untuk Injectorobjek contoh kelas perkhidmatan dan hantarkannya kepada komponen 创建维护Objek contoh perkhidmatan (menguruskan penciptaan dan pemerolehan objek perkhidmatan). 注入

• : Konfigurasikan objek penyuntik, nyatakan kelas perkhidmatan untuk mencipta objek contoh perkhidmatan dan dapatkan pengecam objek contoh. (Penyedia: Pembekal) Provider

2.1 Penyuntik

Penyuntik bertanggungjawab untuk mencipta objek contoh kelas perkhidmatan dan menyuntik objek contoh kelas perkhidmatan ke dalam yang diperlukan komponen.

• Buat penyuntik

  import { ReflectiveInjector } from "@angular/core"
  // 服务类
  class MailService {}
  // 创建注入器并传入服务类
  const injector = ReflectiveInjector.resolveAndCreate([MailService])

• Dapatkan objek contoh kelas perkhidmatan dalam penyuntik

  const mailService = injector.get(MailService)

• Objek contoh perkhidmatan berada dalam mod tunggal, dan penyuntik akan cache selepas mencipta tika perkhidmatan

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

• Penuntik yang berbeza mengembalikan objek contoh perkhidmatan yang berbeza

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

• Fungsi carian contoh perkhidmatan adalah serupa dengan

  Jika tahap semasa boleh ditemui, gunakan tahap semasa Jika tahap semasa tidak ditemui, cari dalam tahap induk 作用域链

  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 Pembekal

• Konfigurasikan objek penyuntik, nyatakan kelas perkhidmatan untuk mencipta objek contoh dan kaedah untuk mengakses logo objek contoh perkhidmatan.

  const injector = ReflectiveInjector.resolveAndCreate([
    { provide: MailService, useClass: MailService }
  ])

• Pengecam objek bergantung akses juga boleh menjadi jenis rentetan

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

• useValue

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

  Mewujudkan hubungan gandingan yang longgar antara objek contoh dan rujukan luaran Objek luaran memperoleh objek contoh melalui pengecam Selagi pengecam kekal tidak berubah, tidak kira bagaimana kod dalaman berubah. ia tidak akan menjejaskan dunia luar.
  Untuk lebih banyak pengetahuan berkaitan pengaturcaraan, sila lawati:

  Video Pengaturcaraan! !

  Atas ialah kandungan terperinci Pembelajaran sudut bercakap tentang suntikan pergantungan. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!