如何避免使用typescript-reactjs中的if语句？

Question

我有不同类型的动作检查,它们执行不同的功能,我只是在if和else条件下检查动作类型并执行相关功能,如下面的代码片段

public onMessage = (messageEvent) => {
    if (messageEvent.data.action === 'subscribeTriggers') {
        this.subscribeTriggers(messageEvent);
    } else if (messageEvent.data.action === 'setGlobalFilters') {
        this.setGlobalFilters(messageEvent);
    } else if (messageEvent.data.action === 'getGlobalFilters') {
        this.receiveGlobalFilters(messageEvent);
    } else if (messageEvent.data.action === 'initFromGlobalFilters') {
        this.initFromGlobalFilters(messageEvent);
    }

有没有更好的解决方案来处理这种情况,因为我有可能在未来有更多的行动,我必须一次又一次地改变代码,我觉得这是低效的.

在此onMessage函数之间用作porthole库的事件监听器(Porthole是一个用于安全跨域iFrame通信的小型库.)我曾经在我的react app的iframe中进行通信

提前致谢

Answer 1

javascript中的对象可以看作是一个关联数组,其中键是属性或函数的名称.

所以,你可以这样打电话:

this[messageEvent.data.action](messageEvent);

警告(如Joe Clay所述):使用此语法,对象的每个函数this都是可调用的,因此如果this包含您不希望"公开"的函数,则可能导致"安全漏洞".