隨著AngularJS的流行，依賴注入開始在JavaScript領域獲得不少的關注。 DI最突出的好處在于開發(fā)可復用可測試的代碼單元。 本文以簡易的代碼解釋DI的實現機制，更多對DI優(yōu)缺點的討論可參考： 什么時候應該使用依賴注入 一文。

每個模塊聲明自己的依賴，并提供自己的服務。例如：

di.service(’foo’, [’bar’], function foo(bar){ function Foo(){ this.bar = bar; } this.prototype.greeting = function(){ console.log(’hello, world’); } return Foo;}); var foo = di.container.get(’foo’);foo.greeting();

注意依賴注入和CommonJS（或AMD）的區(qū)別， foo 只需要聲明其依賴項 bar 而不需要主動獲取。 正是這一點使得 function foo 對依賴所處的位置和構建方法都完全無知， function foo 成為可測試、可復用的代碼單元。

注冊服務和使用服務應該在不同時期進行。 作為一種特殊的依賴解決工具，DI框架將軟件單元的生命周期分為注冊階段和運行階段。 上述例子中，在注冊階段提供 foo 和 bar 服務，在運行階段獲取并使用這些服務。 多數DI框架都采取lazy construction的策略，該策略也避免了在注冊階段進行構造的困難。

服務的定制可以在注冊階段后運行階段前進行。 AngularJS 1 引入配置階段來定制這些服務，其Provider可以理解為一個特化的工廠對象。 BottleJS 則使用修飾器和中間件來支持對服務的定制。

使用IoC容器來索引服務實例或存儲服務提供者。 當有人提供服務時就把它加入到容器中， 當有人使用服務時就從容器中查找提供者并生成一個服務實例。 通常服務的實例可以被緩存。

先來實現最常見的接口函數 .service() ，該接口用來注冊一個服務的構造器。 被傳入的函數將會被進行 new 操作。

var di = { container: {}};di.service = function(name, Constructor) { defineLazyProperty(name, () => new Constructor());}; function defineLazyProperty(name, getter){ Object.defineProperty(di.container, name, {configurable: true,get: function() { var obj = getter(container); Object.defineProperty(di.container, name, {configurable: false value: obj }); return obj;} });}

Object.defineProperty 在這里用來做服務緩存。 只在第一次構建服務時調用構造器，后續(xù)的訪問就是直接讀取IoC容器的屬性。 它是ES5的標準方法 兼容性非常好 。 有了 defineLazyProperty() 方法，這些常用的注冊接口實現就很直觀了：

di.factory = function(name, factory) { return defineLazyProperty(name, factory);};di.provider = function(name, Provider) { return defineLazyProperty(name, function(){ var provider = new Provider(); return provider.$get(); });};di.value = function(name, val) { return defineLazyProperty(name, () => val);};

服務的定制接口就不再贅述了，值得一提的是統(tǒng)一的服務定制需要統(tǒng)一的服務構造方法， 而不是直接調用 .defineLazyProperty() 生成屬性。 AngularJS 中這些策略都由Provider來實現， 其他的所有服務注冊方法都借由Provider來實現。

來自：http://harttle.com/2016/11/19/javascript-dependency-injection-implementation.html