javascript - 如何降低根据数据类型回调的函数的复杂性？

Question

我正在调整我的身份验证 JavaScript 模块，以便我可以使用一个 JavaScript 类 Hook .js-auth-ui 处理我的 Web 应用程序的身份验证，同时使用数据类型属性来引用正确的函数.

扫描 DOM 中的 js Hook 后，我通过 init 函数运行它，如下所示，该函数又运行一个 exec 函数，该函数回调正确的函数。

我想知道是否有一种更有效的方法来编写 execAuthUi 函数，而无需使用所有 else if，这会根据我的 linting 规则增加其“复杂性”评级。

const execAuthUi = function ( $element ) {
    const data = $element.data();

    if (data.type === "account-login-form") {
        authLoginEmail( $element, data );
    } else if (data.type === "account-logout") {
        authLogout( $element );
    } else if (data.type === "account-reset") {
        authReset( $element );
    } else if (data.type === "account-signup-form") {
        authSignup( $element );
    }
};

const initAuthUi = function ( ) {
    const $notLoaded = $_jsElements.not( ".is-initialized" );
    let $element = null;
    let i = $notLoaded.length;

    for ( i; i--; ) {
        $element = $_jsElements.eq( i );

        $element.addClass( "is-initialized" );

        execAuthUi( $element );
    }
};

Answer 1

使用对象映射类型到回调:

var callbackMap = {
    'account-login-form': authLoginEmail.bind(null, $element, data),
    'account-logout': authLogout.bind(null, $element),
    ...
};

callbackMap[data.type] && callbackMap[data.type]();