self.dispatch.apply(self, args); 这个怎么理解？

Question

/**
         * 添加一个组件实例到大屏中
         *
         * @param {Component} component 组件实例
         * @return {Screen}
         */
        addComponent: function (component) {
            var self = this;

            // 绑定组件的所有事件
            component.bind(function (event) {
                var args = Array.prototype.slice.call(arguments, 1);
                args.unshift(this);
                args.unshift('component.' + event);
                self.dispatch.apply(self, args);
            });

            // 添加到大屏中
            component.render(self.container);

            // 放入列表中
            self.componentsById[component.id] = component;

            return self;
        }

Answer 1

遇到这种问题，你应该先了解一下 apply 的意义。它表示执行函数，并且以第一个参数作为 context，第二个参数作为函数的参数依次传入。

所以在这个地方，因为组件本身是通用的，有哪些事件，需要传入哪些参数无法确定，所以只好使用 apply 的方式把所有事件全部传到处理函数中。

Answer 2

apply的用法

1.改变调用的函数作用域 this的值

function fn(){
    console.log(this.a);//我是obj
}
var obj = {a:"我是obj"}
fn.apply(obj);//将this指向obj

2.当不明确参数数量的时候可以吧数组转换为参数

function fn(a, b, ...){
  console.log(a,b);// 1, 2
}
fn.apply(null,["1", "2"]);

这里改变后

var self = this;
component.bind(function (event, a, b, ...) {
    self.dispatch(this, 'component.' + event, a, b, ... );
});