为什么此回调不返回JavaScript中的值？

Question

gsvc.project(params, function (projectedPoints) {
    pt = projectedPoints[0];
});

geometry.addPath(pt);

Can anyone tell me why projectedPoints only returns once an error is thrown? The code doesn't enter the callback and tries to assign pt while it is undefined to an array. This causes the code to error, which is when the callback finally initiates.

I've been trying to reference the code from here , but can't seem to figure out how to get the callback to work like in the xample.

` var map, gsvc, pt;

  require([
    "esri/map", "esri/graphic", "esri/symbols/SimpleMarkerSymbol",
    "esri/tasks/GeometryService", "esri/tasks/ProjectParameters",
    "esri/SpatialReference", "esri/InfoTemplate", "dojo/dom", "dojo/on",
    "dojo/domReady!"
  ], function(
    Map, Graphic, SimpleMarkerSymbol,
    GeometryService, ProjectParameters,
    SpatialReference, InfoTemplate, dom, on
  ) {
    map = new Map("map", {
      basemap: "streets",
      center: [-98.445, 46.147],
      zoom: 3
    });

    gsvc = new GeometryService("http://tasks.arcgisonline.com/ArcGIS/rest/services/Geometry/GeometryServer");
    map.on("click", projectToWebMercator);

    function projectToWebMercator(evt) {
      map.graphics.clear();

      var point = evt.mapPoint;
      var symbol = new SimpleMarkerSymbol().setStyle("diamond");
      var graphic = new Graphic(point, symbol);
      var outSR = new SpatialReference(102100);

      map.graphics.add(graphic);

      gsvc.project([ point ], outSR, function(projectedPoints) {
        pt = projectedPoints[0];
        graphic.setInfoTemplate(new InfoTemplate("Coordinates",
          "<span>X:</span>" + pt.x.toFixed() + "<br>" + 
          "<span>Y:</span>" + pt.y.toFixed() + "<br>" + 
          "<input type='button' value='Convert back to LatLong' id='convert'>" +
          "<div id='latlong'></div>"));
        map.infoWindow.setTitle(graphic.getTitle());
        map.infoWindow.setContent(graphic.getContent());
        map.infoWindow.show(evt.screenPoint, map.getInfoWindowAnchor(evt.screenPoint));
        on.once(dom.byId("convert"), "click", projectToLatLong);
      });
    }

    function projectToLatLong() {
      var outSR = new SpatialReference(4326);
      var params = new ProjectParameters();
      params.geometries = [pt.normalize()];
      params.outSR = outSR;

      gsvc.project(params, function(projectedPoints) {
        pt = projectedPoints[0];
        dom.byId("latlong").innerHTML = "<span>Latitude: </span> " + 
          pt.y.toFixed(3) + "<br><span>Longitude:</span>" + pt.x.toFixed(3);
      });
    }
  });
</script>`

Answer 1

You have a variable scope issue. pt needs to be defined outside your callback.

var pt;

gsvc.project(params, function(projectedPoints) {
    pt = projectedPoints[0];
});

geometry.addPath(pt);

EDIT:

If the .project() method is asynchronous, then Arun's answer is the correct approach.

Answer 2

It might be because project is a async method if so

//looks like project is a async method
gsvc.project(params, function (projectedPoints) {
    var pt = projectedPoints[0];
    //do all operations which depends on pt in the callback
    geometry.addPath(pt);
});

//so this part will get executed before the callback is executed so pt won't be defined

• How do I return the response from an asynchronous call? - it follows the same principle as ajax requests