如何理解emitter.js里面的dispatch和broadcast

//这里面的核心思想是通过递归或遍历来查找要broadcast或dispatch的组件名字，然后在组件自身上emit与on


function broadcast(componentName, eventName, params) {
  this.$children.forEach(child => {
    var name = child.$options.componentName;

    if (name === componentName) {
      child.$emit.apply(child, [eventName].concat(params));
    } else {
      broadcast.apply(child, [componentName, eventName].concat([params]));
    }
  });
}
export default {
  methods: {
    dispatch(componentName, eventName, params) {
        console.log(‘--------向上转发‘, componentName, eventName, params)
      var parent = this.$parent || this.$root;
      var name = parent.$options.componentName;

      while (parent && (!name || name !== componentName)) {
        parent = parent.$parent;

        if (parent) {
          name = parent.$options.componentName;
        }
      }
      if (parent) {
        parent.$emit.apply(parent, [eventName].concat(params));
      }
    },
    broadcast(componentName, eventName, params) {
      console.log(‘--------向下广播‘, componentName, eventName, params)
      broadcast.call(this, componentName, eventName, params);
    }
  }
};

<div class="home">
    <HelloWorld msg="Welcome to Your Vue.js App" @clickFun="handleEvent"/>
    <s-input v-model="txt" type="input"></s-input>
    <button @click="test2">父组件的按钮dispatch</button>
  </div>

test2(){
      this.broadcast(‘SButton‘,‘test‘,‘子组件触发dispatch事件---‘)  
//三个参数分别是componentName，表
  示组件名称，用于匹配正确到正确的组件名。eventName，事件名，需要触发的事件params，参数，触发时带入的参数

// console.log(‘vue2已经废弃‘)
    }