本篇文章帶大家了解一下依賴注入,介紹一下依賴注入解決的問題和它原生的寫法是什么,并聊聊Angular的依賴注入框架,希望對(duì)大家有所幫助!
前端(vue)入門到精通課程,老師在線輔導(dǎo):聯(lián)系老師
Apipost = Postman + Swagger + Mock + Jmeter 超好用的API調(diào)試工具:點(diǎn)擊使用
最近在Angular項(xiàng)目中經(jīng)常能碰到依賴注入這個(gè)關(guān)鍵詞,但是始終不理解它是怎么實(shí)現(xiàn)的,在Angular的官網(wǎng)上也只有關(guān)于它的使用,詳細(xì)點(diǎn)的原理并沒有說明,所以就下來我們就從原生的寫法來講解一下,依賴注入是用來解決什么問題的,他用js應(yīng)該怎么去表現(xiàn)?!鞠嚓P(guān)教程推薦:《angular教程》】
依賴注入是什么
依賴注入簡稱DI,是面向?qū)ο缶幊讨械囊环N設(shè)計(jì)原則,用來減少代碼之間的耦合度。
我們先來看一段代碼
class Video{ constructor(url){} } class Note{ video: Video constructor(){ this.video = new Video("https://aaaaa.mp4") } getScreenshot(){ this.video.getScreenshot() } } const note = new Note() note.getScreenshot()
假設(shè)我們用一個(gè)視頻類,它其中有一個(gè)方法 getScreenshot 獲取截圖,在實(shí)例化視頻類的時(shí)候,需要傳入一個(gè)視頻 url 這樣的參數(shù)。現(xiàn)在有一個(gè)筆記類,它需要去調(diào)用視頻類下的截圖方法,那么我們就可以說,筆記類是依賴于視頻類的。所以在筆記類的內(nèi)部,我們就需要去實(shí)例化視頻類,這樣才能在筆記類中獲取視頻類的實(shí)例對(duì)象,并且調(diào)用它里面的截圖方法。
上面代碼的耦合度過高,并不推薦使用,比方說如果Video的視頻地址換了一個(gè),那么在Note中就需要去改變傳入的視頻url,這樣假設(shè)要是有