深入理解 Daze.js 之 IoC 容器原理

简介

Daze.js 底层通过容器的模式设计,所有功能都是基于这个容器进行构建,通过容器,我们可以实现解耦、依赖注入等功能

依赖

我们创建一个普通的类

class Example{

  // ...

}

然后再创建一个可能会被依赖的类

class Attr {

  constructor(attr1, attr2, attr3) {

    this.attr1 = attr1

    this.attr2 = attr2

    this.attr3 = attr3

  }

}

第一个类依赖了第二个类

class Example {

  constructor() {

    this.attr = new Attr(1, 2, 3)

  }

}

这种形式就是我们最常见的模式,简单的依赖关系,看起来也还ok,但是如果依赖多了呢?

class Example {

  constructor() {

    this.attr1 = new Attr1()

    this.attr2 = new Attr2()

    // ...more

  }

}

我们可以看到,每次实例化 Example 的时候都需要实例化对应依赖的对象

为了解决这个问题,有人就提出了工厂模式

工厂模式

为了实现这个功能,我们需要一个可以实例化不同依赖的工厂

class Factory {

  build(type) {

    switch(type) {

      case 'car':

        return new Car()

      case 'plane':

        return new Plane()

      default:

        return

    }

  }

}

有了这个工厂,我们就可以只修改工厂的种类就可以自动实例化不同的依赖对象了

class Example {

  constructor(attrs) {

    const factory = new Factory()

    for (const attr of attrs) {

      factory.build(attr)

    }

  }

}

// 实例化依赖 Car 和 Plane 的类

const example1 = new Example(['car', 'plane'])

// 实例化依赖 Car 的类

const example2 = new Example(['car'])

依赖注入

我们可以看到,刚刚的工厂其实只是把多个依赖转移到了对工厂的依赖,工厂内部还是需要手动增加各种以来的生产线,如何解决这个问题呢,那就是依赖注入

我们改造一下Example的类

class Example {

  construtor(attr) {

    this.attr = attr

  }

}

const car = new Car()

const example = new Example(car)

我们把内部的依赖在外部实例化然后通过构造函数或者其他方法注入到类中,这就是依赖注入,是不是很简单,理解了依赖注入后,我们就可以开始 IoC容器了

IoC 容器

不管如何,现在都是通过手动注入的方式进行以来管理,那么我们可不可以自动化管理依赖呢,我们只要声明需要注入的依赖即可,这时候 IoC 容器出现了

class Container {

  constructor() {

    this.binds = {}

    this.instances = {}

  }


  bind(abstract, concrete) {

    if (typeof concrete === 'function') {

      this.binds[abstract] = concrete

    } else {

      this.instances[abstract] = concrete

    }

  }


  make(abstract, args = []) {

    if (this.instances[abstract]) return this.instances[abstract]

    return this.binds[abstract](this, ...args)

  }

}

一个 IoC 容器就粗略的完成了,我们来试验一下它是如何工作的

// 创建容器实例

const container = new Container()

// 告诉容器需要如何实例化 example

container.bind('example', (_container, attr) => {

  return new Example(_container.make(attr))

})

// 告诉容器如何实例化 car

container.bind('car', () => {

  return new Car()

})

// 告诉容器如何实例化 plane

container.bind('plane', () => {

  return new Plane()

})

// 根据参数创建 Example 实例

container.make('example', 'car')

container.make('example', 'plane')

这个可以用来实例一种依赖的容器,只要稍加修改就可以支持多依赖管理,大家可以自己动手试试~~~~~

当然 Daze.js 容器不止这些功能, 还有自动实例化、实例标签、上下文注入等等.....

传送门:

官网

项目地址

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 概述 关于Spring Spring作为目前Java领域最热门的开发框架,是一个Java程序员最常用的框架,并且在...
    emi_leng阅读 2,258评论 1 20
  • Data Visualization with D3 D3: SVG中的jQurey 1. Add Documen...
    王策北阅读 908评论 0 2
  • core package 概要:Core是所有其他包的基础包.它提供了大部分功能包括metadata,templa...
    LOVE小狼阅读 2,963评论 0 3
  • 先说几句废话,调和气氛。事情的起由来自客户需求频繁变更,伟大的师傅决定横刀立马的改革使用新的框架(created ...
    wsdadan阅读 3,232评论 0 12
  • 【李嘉诚、马云推崇的左宗棠语录】1、发上等愿,结中等缘,享下等福;择高处立,寻平处住,向宽处行。2、能受天磨真铁汉...
    广聪阅读 155评论 0 0

友情链接更多精彩内容