Question

我正在使用JS和Angular来解决以下问题。

我从requestService获取数据，因此请调用请求函数，然后对成功的数据执行某些操作＆＃39;功能。在这个函数里面，一切都很好，我得到了所有的结果，但是一旦离开成功函数，我的结果是未定义的。我读了一些关于类似问题的其他问题/答案，并尝试了其他的事情。但是，我真的不知道如何处理这个问题，并想通过代码示例明确地问这个问题：

function loadShips() {
      var count = 0;
      RequestService.getShips(nelat, swlat, nelong, swlong, timestamp)
      .success(function(results) {
        var groupedShips = results.aisData.aisGroupedByShipType;
        _.each(groupedShips, function(groupedShip) {
          _.each(groupedShip, function(ship) {
            Markers['marker' + count] = createMarker(ship);
            count++;
          });
        });
        console.log(Markers, '#1')
        return Markers
      });
      console.log(Markers, '#2');
      return Markers;
    }

所以任何人都可以告诉我，为什么标记会出现在＆＃39;＃1＆＃39;是定义和＃2＆＃39;未定义。

Answer 1

假设请求是异步完成的，＃2处的调用是在调用请求的success方法之前发生的。这可以解释为什么该对象尚不存在。

一种解决方案是将回调方法作为参数传递到工厂，然后在请求成功发生后调用该方法。这看起来像这样：

function loadShips(callBack) {
    var count = 0;
    RequestService.getShips(nelat, swlat, nelong, swlong, timestamp)
        .success(function(results) {
            var groupedShips = results.aisData.aisGroupedByShipType;
            _.each(groupedShips, function(groupedShip) {
                _.each(groupedShip, function(ship) {
                    Markers['marker' + count] = createMarker(ship);
                    count++;
                });
            });
        console.log(Markers, "#1");
        callBack(Markers);
    });
}

使用此方法如下所示：

function myCallback(markers){
    console.log(markers, "#2");
    //assign markers to something
}

loadShips(myCallback);

Answer 2

正如Will P所指出的，对于异步函数，它们之后的内联代码将首先执行，因为成功函数仍在事件队列中等待。

除此之外，Markers正在从一个匿名函数内部返回，该函数不会因loadShips而返回它，但会将它返回到ajax仙境中，永远不会被看到。

您需要做的是拥有一个在准备就绪时接收数据并使用数据调用该函数的函数。我假设在船只装载后发生了事情，在匿名功能完成创建标记后必须调用这些东西。

function loadShips() {
    var count = 0;
    RequestService.getShips(nelat, swlat, nelong, swlong, timestamp)
    .success(function(results) {
      var groupedShips = results.aisData.aisGroupedByShipType;
      _.each(groupedShips, function(groupedShip) {
        _.each(groupedShip, function(ship) {
          Markers['marker' + count] = createMarker(ship);
          count++;
        });
      });
      doFancyWonderfulThingsInTheOcean(Markers);
    });
 }

成功后的json返回undefined

2 个答案: