คอนเทนเนอร์ DI ด้วย InversifyJS
ลงทะเบียนและแก้ไขบริการด้วยคอนเทนเนอร์
คอนเทนเนอร์ DI ด้วย InversifyJS เป็นบทเรียน TypeScript Academy ฟรีบน CoddyKit นี่คือบทเรียนที่ 3 จากทั้งหมด 4 บทเรียน คุณสามารถอ่านบทเรียนทั้งหมดด้านล่างฟรี — จากนั้นลองปฏิบัติด้วยตัวคุณเองในเบราว์เซอร์พร้อมตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7 บทเรียนนี้เป็นส่วนหนึ่งของเส้นทางการเรียน TypeScript Academy และความก้าวหน้าของคุณจะซิงค์ข้ามเว็บและแอป CoddyKit คอร์ส TypeScript Academy มีบทเรียนทั้งหมด 4 บทเรียน
เหตุใดจึงต้องใช้คอนเทนเนอร์ DI
การเชื่อมต่อกราฟอ็อบเจ็กต์ขนาดใหญ่ด้วยตนเองนั้นยุ่งยากและเกิดข้อผิดพลาดได้ง่าย คอนเทนเนอร์ DI จะลงทะเบียนวิธีสร้างการพึ่งพาแต่ละรายการและแก้ไขการพึ่งพาเหล่านั้นโดยอัตโนมัติ InversifyJS เป็นคอนเทนเนอร์ TypeScript ที่ได้รับความนิยม
การติดตั้งและเปิดใช้งาน
InversifyJS อาศัยตัวตกแต่งและข้อมูลเมทาดาทาจากการสะท้อน คุณจะนำเข้าโมดูลจาก inversify และเปิดใช้ experimentalDecorators รวมถึง reflect-metadata
import "reflect-metadata";
import { Container, injectable, inject } from "inversify";กำกับคลาสด้วย @injectable
ตัวตกแต่ง @injectable() บอกคอนเทนเนอร์ว่าคลาสนั้นสามารถสร้างและฉีดการพึ่งพาได้ คลาสทุกคลาสที่คอนเทนเนอร์สร้างจำเป็นต้องมีตัวตกแต่งนี้
import { injectable } from "inversify";
@injectable()
class ConsoleLogger {
log(m: string) { console.log(m); }
}ประกาศการพึ่งพาด้วย @inject
ใช้ @inject(token) กับพารามิเตอร์ของคอนสตรักเตอร์เพื่อบอกคอนเทนเนอร์ว่าควรจัดหาการผูกใดให้ โทเคนจะใช้ระบุการพึ่งพา
@injectable()
class OrderService {
constructor(@inject("Logger") private logger: ConsoleLogger) {}
place() { this.logger.log("placed"); }
}การสร้างคอนเทนเนอร์
Container เก็บการผูกทั้งหมดสำหรับแอปพลิเคชันของคุณ คุณจะสร้างคอนเทนเนอร์หนึ่งรายการเมื่อเริ่มต้นแอปพลิเคชัน แล้วลงทะเบียนการพึ่งพาไว้กับคอนเทนเนอร์นั้น
import { Container } from "inversify";
const container = new Container();การผูกอินเทอร์เฟซเข้ากับการทำงานจริง
ส่วนติดต่อแบบต่อเนื่อง bind<T>(token).to(Impl) จะแมปโทเคน ซึ่งมักเป็นอินเทอร์เฟซ เข้ากับคลาสรูปธรรมที่คอนเทนเนอร์จะสร้างอินสแตนซ์
interface Logger { log(m: string): void; }
container.bind<Logger>("Logger").to(ConsoleLogger);การแก้ไขบริการ
container.get<T>(token) จะสร้างบริการที่ร้องขอ โดยสร้างและฉีดการพึ่งพาของบริการนั้นแบบเรียกต่อเนื่องให้คุณโดยอัตโนมัติ
container.bind<OrderService>(OrderService).toSelf();
const svc = container.get<OrderService>(OrderService);
svc.place();การสลับการทำงานแบบรูปธรรม
หากต้องการใช้ logger อื่น ให้ผูกโทเคนเข้ากับคลาสอื่นใหม่ ผู้ใช้บริการจะไม่ต้องแก้ไข เพราะพึ่งพาโทเคน ไม่ใช่คลาสรูปธรรม
@injectable()
class SilentLogger implements Logger { log() {} }
container.rebind<Logger>("Logger").to(SilentLogger);ขอบเขตแบบอินสแตนซ์เดียว
ตามค่าเริ่มต้น การเรียกใช้ get แต่ละครั้งอาจสร้างอินสแตนซ์ใหม่ ใช้ inSingletonScope() เพื่อแบ่งปันอินสแตนซ์เดียวกันทั่วทั้ง app
container.bind<Logger>("Logger").to(ConsoleLogger).inSingletonScope();การทดสอบด้วยคอนเทนเนอร์
ในการทดสอบ คุณสามารถสร้างคอนเทนเนอร์ใหม่และผูกตัวจำลอง ทำให้ได้รับประโยชน์จากการเชื่อมต่อแบบเดียวกัน พร้อมแยกยูนิตที่อยู่ระหว่าง test ออกจากส่วนอื่น
const testContainer = new Container();
testContainer.bind<Logger>("Logger").to(SilentLogger);ข้อแลกเปลี่ยนของคอนเทนเนอร์
คอนเทนเนอร์ช่วยลดโค้ดประกอบซ้ำสำหรับกราฟขนาดใหญ่ แต่เพิ่มการพึ่งพา ตัวตกแต่ง และการอ้อมผ่านหลายชั้น สำหรับแอปขนาดเล็ก การฉีดผ่านคอนสตรักเตอร์ด้วยตนเองมักชัดเจนกว่า
ตรวจสอบอย่างรวดเร็ว
ตรวจสอบความเข้าใจสั้น ๆ เกี่ยวกับบทเรียนนี้
ทบทวน
InversifyJS ใช้ @injectable, @inject(token) และ Container คุณใช้ bind<Interface>(token).to(Impl) แล้ว container.get จะแก้กราฟการพึ่งพาให้โดยอัตโนมัติ โดยต้องใช้ reflect-metadata และตัวตกแต่ง ซึ่งแลกความยุ่งยากของโค้ดเริ่มต้นกับการอ้างอิงทางอ้อม
คำถามที่พบบ่อย
บทเรียน “คอนเทนเนอร์ DI ด้วย InversifyJS” ฟรีหรือไม่
ใช่ — ข้อความเต็มของ “คอนเทนเนอร์ DI ด้วย InversifyJS” ฟรีให้อ่านที่นี่บนเว็บ เพื่อปฏิบัติแบบโต้ตอบ (ตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7) และปลดล็อคส่วนที่เหลือของคอร์ส TypeScript Academy ให้อัปเกรดเป็น CoddyKit PRO คอร์ส TypeScript Academy มีบทเรียนทั้งหมด 4 บทเรียน
คุณจะเรียนรู้อะไรในบทเรียน “คอนเทนเนอร์ DI ด้วย InversifyJS”
ลงทะเบียนและแก้ไขบริการด้วยคอนเทนเนอร์ คุณปฏิบัติ TypeScript Academy ด้วยโค้ดที่ใช้งานได้จริงที่คุณเรียกใช้โดยตรงในเบราว์เซอร์ และติวเตอร์ AI ตลอด 24/7 ตอบคำถามของคุณขณะที่คุณไปผ่านบทเรียน
คุณต้องมีประสบการณ์ก่อนที่จะเริ่มเรียน TypeScript Academy หรือไม่
ไม่จำเป็นต้องมีประสบการณ์มาก่อน TypeScript Academy บน CoddyKit ออกแบบมาสำหรับผู้เริ่มต้นไปจนถึงผู้เรียนขั้นสูง คุณสามารถเริ่มต้นที่นี่หรือเริ่มจากตัวแรกและเรียนด้วยความเร็วของคุณเอง นี่คือบทเรียนที่ 3 จากทั้งหมด 4 บทเรียน
บทเรียน “คอนเทนเนอร์ DI ด้วย InversifyJS” ใช้เวลานานแค่ไหน
บทเรียน CoddyKit ส่วนใหญ่ใช้เวลาประมาณ 5–10 นาที แต่ละบทเรียนจึงสั้นและเป็นแบบโต้ตอบ คุณสามารถก้าวหน้าอย่างต่อเนื่องและกลับมาเรียนต่อจากตรงที่เพิ่งหยุดบนเว็บและแอปได้เลย
ฉันเขียนและรันโค้ดในบทเรียน TypeScript Academy นี้ได้ไหม
ได้ บทเรียน TypeScript Academy ทุกบทมีตัวแก้ไขโค้ดในตัว คุณจึงเขียนและรันโค้ดจริงได้เลยในเบราว์เซอร์ และได้รับข้อเสนอแนะจาก AI ในทันที — ไม่ต้องติดตั้งในเครื่องของคุณ
บทเรียนทั้งหมดในหลักสูตรนี้
- พื้นฐานการกลับทิศทางการควบคุม
- การฉีดผ่านตัวสร้าง
- คอนเทนเนอร์ DI ด้วย InversifyJS
- โทเคนบริการที่ปลอดภัยด้านชนิดข้อมูล