AngularJS多$http.get服务优化咨询：如何简化代码减少重复？

嘿，我看你目前的AngularJS服务里有不少重复的代码结构，完全可以通过抽象通用逻辑来简化！咱们来重构一下，让代码更简洁易维护。

第一步：重构服务代码 #

核心思路是把重复的$http.get逻辑抽成一个通用函数，然后让各个数据调用方法复用这个函数，同时去掉不必要的嵌套对象（原来的return { getData: getData }其实多了一层调用，完全可以简化）。

优化后的服务代码：

app.service("myService", function ($http) {
  // 抽离通用的GET请求处理函数
  const makeGetRequest = (url, params = {}) => {
    return $http.get(url, { params });
  };

  // 无参数的接口调用
  this.callData1 = () => makeGetRequest(myurl1);
  this.callData2 = () => makeGetRequest(myurl2);

  // 带参数的接口调用
  this.callData3 = (var1, var2) => makeGetRequest(myurl3, { var1, var2 });
});

第二步：简化控制器代码 #

因为现在每个callDataX方法直接返回Promise，所以不需要再调用.getData()，控制器代码可以更简洁：

app.controller("myController", function ($scope, myService) {
  myService.callData1().then(function (response) {
    $scope.var1 = response.data;
  });

  myService.callData2().then(function (response) {
    $scope.var2 = response.data;
  });

  const var1 = "something";
  const var2 = "something else";
  myService.callData3(var1, var2).then(function (response) {
    $scope.var3 = response.data;
  });
});

为什么这样优化更好？ #

• 减少重复代码：所有GET请求的逻辑都集中在makeGetRequest里，以后如果要修改请求配置（比如添加统一的请求头、处理错误），只需要改这一个地方，不用逐个修改每个callData方法。
• 简化调用链路：去掉了多余的callDataX().getData()嵌套，直接调用callDataX()就能拿到Promise，代码更直观。
• 扩展性强：如果以后需要支持POST等其他请求方法，只需要扩展通用函数，比如新增makePostRequest，复用性很高。

内容的提问来源于stack exchange，提问作者Simon