javascript - ¿Por qué los Callbacks de Promise `.then` Methods son un antipatrón?

angularjs angular-promise

Question

He visto respuestas en StackOverflow donde la gente sugiere que se proporcione una función de devolución de llamada a un servicio AngularJS.

app.controller(''tokenCtrl'', function($scope, tokenService) {
    tokenService.getTokens(function callbackFn(tokens) {
        $scope.tokens = tokens;
    });
});

app.factory(''tokenService'', function($http) {
    var getTokens = function(callbackFn) {
        $http.get(''/api/tokens'').then (function onFulfilled(response) {
            callbackFn(response.data);
        });
    };

    return {
        getTokens: getTokens
    };
});

Esto me parece ser un antipatrón. El servicio $http devuelve promesas y hacer que los métodos .then ejecuten funciones de devolución de llamada parece una inversión de control poco saludable.

¿Cómo se vuelve a factorizar un código como este y cómo se explica por qué la forma original no era una buena idea?

Answer 1

Deberías cambiarlo a

var getTokens = function() {
      return $http.get(''/api/tokens'');
    };

Y luego, en otro módulo de uso

yourModule.getTokens()
  .then(function(response) {
    // handle it
  });

En cuanto a por qué es un antipatrón, diría que, primero, no le permite encadenar aún más sus métodos de manejo de éxito / fracaso. En segundo lugar, maneja el control del procesamiento de la respuesta del módulo que llama al módulo llamado (que puede no ser muy importante aquí, pero aún impone la misma inversión de control). Y finalmente, agrega el concepto de promesas a su base de código, que puede no ser tan fácil de entender para algunos de los compañeros de equipo, pero luego usa promesas como devoluciones de llamada, por lo que esto realmente no tiene sentido.

Answer 2

El código se puede refactorizar de la siguiente manera:

app.controller(''tokenCtrl'', function($scope, tokenService) {
    tokenService.getTokens.then ( callbackFn(tokens) {
        $scope.tokens = tokens;
    });
});

app.factory(''tokenService'', function($http) {
    var getTokens = function() {
        //return promise
        return $http.get(''/api/tokens'').then (function onFulfilled(response) {
                //return tokens
                return response.data;
            }
        );
    };

    return {
        getTokens: getTokens
    };
});

Al hacer que el servicio devuelva una promesa y usar el método .then de la promesa, se logra la misma funcionalidad con los siguientes beneficios:

• La promesa se puede guardar y usar para encadenar .

• La promesa se puede guardar y usar para evitar repetir la misma llamada $http .

• La información del error se retiene y se puede recuperar con el método .catch .

• La promesa puede ser enviada a otros clientes.