javascript - Emberjs注入问题

Question

看ember的文档，一直看不明白注入。
到了后来，ember的注入方式还变了。
求高手解释！

//1.10.0的注入
Ember.Application.initializer({
  name: 'logger',

  initialize: function(container, application) {
    var logger = {
      log: function(m) {
        console.log(m);
      }
    };

    application.register('logger:main', logger, { instantiate: false });
    application.inject('route', 'logger', 'logger:main');
  }
});

//这是1.13.0的注入
export function initialize(container, application) {
  var logger = {
    log(message) {
      console.log(message);
    }
  };

  application.register('logger:main', logger, { instantiate: false });
  application.inject('route', 'logger', 'logger:main');
}

export default {
  name: 'logger',
  initialize: initialize
};

Answer 1

注入方式没本质的区别，第二种注入方式只是配合Ember-Cli时的处理方式而已。

在Ember-Cli下使用第二种方式比较方便进行文件的管理，在initializers文件下，各个文件负责各自的initializer看起来比较整齐，当然你也可以自己用grunt使用第一种方式进行构建。

//-----------------------------------------
注入这个概念和Spring中的DI差不多是一个东西

在大部分场景下，Ember获取对象的方式都是通过 container生成对象

过程等同于

//在这个过程中使用 namespace:name进行区隔，一般注入也都是根据namespace进行注入
//以下这句向容器注入一个 logger对象，并且指定该对象不实例化
application.register('logger:main', logger, { instantiate: false });
application.inject('route', 'logger', 'logger:main');

//比如进入 http://somedomain.com/#/index
//Ember会通过容器索要 indexRoute,indexController,indexView等
App.__container__.lookup('route:index');
App.__container__.lookup('controller:index');
App.__container__.lookup('view:index');

//在lookup('route:index')时，过程如
//.. 
var IndexRouteFactory =App.__container.lookupFactory('route:index');
//IndexRouteFactroy就是你的IndexRoute
//然后根据之前指定的inject,容器得知，要向这个IndexRoute的实例中注入一个logger对象

var logger=App.__container__.lookup('logger:main');
IndexRouteFactory.create({logger:logger});

总之注入最大的目的在于解耦代码

Answer 2

第二种是类似es6模块化的一些思想，方便引入和构建