Injector框架理解(二）

今天我们继续学习didi这个依赖注入框架，上一节我们知道了怎么定义组件，怎么定义模块，怎么通过Injector这个类来载入模块和获取组件。

今天我们来学习如何重用模块：

我们首先定义好组件和模块:

const {Injector} = require('didi');
class FooType {
    constructor() {
      this.name = 'foo';
    }
}

function barFactory(foo) {
    return foo;
}

const module1 = ({
    foo: [ 'type', [ FooType ] ],
    bar: [ 'factory', [ 'foo', barFactory ] ],
});
const injector1 = new Injector([module1]);
console.log('injector1:',injector1);
console.log(injector1.get('foo')===injector1.get('bar'))

const injector2 = new Injector([module1]);
console.log('injector2:',injector2);
console.log(injector2.get('foo')===injector2.get('bar'))

console.log(injector1.get('foo')===injector2.get('foo'))

说明一下，这里的代码，首先我们定义了两个组件，一个是FooType，另一个是工厂方法barFactory返回的foo组件，其实看模块的定义实际上就是FooType的具体实例。然后我们将这两个组件定义为模块，这个模块的定义是可以重用的，用不同的依赖注入加载器加载后，它们的实例存在于不同的加载器中，虽然实例不同，但是它们的作用是相同的。

我们先看看运行的效果：

可以看出，这两个加载器中的实例是一模一样的。因此，定义好了模块以后是可以重用的。这里也存在一个问题，那就是组件的定义：

模块中组件的定义是这样的：

 const preModule =({
    foo: [
      'factory',
      function() {
        return 'foo-value';
      }
    ],
    bar: ['value', 'bar-value'],
    bub: ['type', BubType],
    buz: ['type', BuzType]
});
const curModule = ({
    foo: [ 'type', [ FooType ] ],
    bar: [ 'factory', [ 'foo', barFactory ] ],
});
//注意对于factory类型的组件，存在两种不同的定义方法，它们的第二个参数可以是一个函数
//也可以是一个数组，从后面可以看出，这是一个配置有依赖组件的数组
//同时，对于type类型的组件，第二个参数可以是一个类，也可以是一个数组，而数组中的值是一个类
//以上这样设计的原因，我们会在后文进行分析

依赖注入的方式，数组定义：

const {Injector} = require('didi');
class FooType {
    constructor() {
      this.name = 'foo';
    }
}

function barFactory(foo) {
    return foo;
}

const module1 = ({
    foo: [ 'type', [ FooType ] ],
    bar: [ 'factory', [ 'foo', barFactory ] ],
});
const injector3 = new Injector([ module1 ]);
function fn(foo, bar) {
    console.log('foo0:',foo);
    console.log('foo1:',injector3.get('foo'));
    console.log('bar0:',bar);
    console.log('bar1:',injector3.get('bar'));
}
const annotatedFn = [ 'foo', 'bar', fn ];

injector3.invoke(annotatedFn);

我们看运行结果：

可以知道，依赖注入的配置可以是一个数组，而数组的最后一个就是组件函数，前面的所有参数就是这个函数组件依赖的组件，比如这里的fn组件依赖于foo和bar组件可以这样配置。

const annotatedFn = [ 'foo', 'bar', fn ];

好了，今天我们主要学习并理解了didi框架的模块重用以及数组形式的组件依赖注入配置。

Injector框架理解(二）

意见和建议