等待異步JavaScript函數來檢索結果的末尾（遞延？）

Question

好球員，我知道這個話題已經討論過多次，但我無法找到答案，解決我的問題。

所以我試圖做一個簡單的想： 我創建一個字符串，如：distance is : " + CalculateDistance(position); 的通緝的結果是一樣的東西distance is 5kms (8min)。

CalculateDistance(position)是調用谷歌地圖API稱爲DistanceMatrix兩點之間計算距離的函數。 API記錄爲here，並且給出的示例完美地起作用。我適應這樣的：

function CalculateDistance(position) 
{ 
    var service = new google.maps.DistanceMatrixService(); 
    var destination = new google.maps.LatLng(/* some lat/lng */); 

    service.getDistanceMatrix(
    { 
     origins: [position], 
     destinations: [destination], 
     travelMode: google.maps.TravelMode.DRIVING, 
     unitSystem: google.maps.UnitSystem.METRIC, 
     avoidHighways: false, 
     avoidTolls: false 
    }, callback); 
} 

function callback(response, status) { 
    if (status == google.maps.DistanceMatrixStatus.OK) 
    { 
     var origins = response.originAddresses; 
     var destinations = response.destinationAddresses; 

     var results = response.rows[0].elements; 
     distanceMatrixResult = results[0].distance.text + " (" + results[0].duration.text + " min)"; 
    } 

哦，順便說一句，distanceMatrixResult是一個全局變量。實際上，我只需要獲取結果[0] .distance.text的內容（並且當我在控制檯中打印callback()時，該值爲OK），然後將該值與「Distance is」連接起來。如果有人有更聰明的解決方案，歡迎！

API調用是異步，在我的情況下，distanceMatrixResult總是在結果字符串中爲空。但是當我在控制檯中記錄它的值時，distanceMatrixResult值成爲好的那個AFTER字符串被創建。

所有我想要寫的是：

•呼叫CalculateDistance（其中調用回調異步）
•當callback結束時，連接具有distanceMatrixResult值的字符串。

我嘗試了一些Deferred，像$.done()和$.when().then()，但我不能成功...

有人能幫助我嗎？
謝謝！

Answer 1

distanceMatrixResult是一個全局變量

它不應該，應該是其自己的諾言（延期）代表的價值。這是基本的設置：

function calculateDistance(position) { 
    var service = new google.maps.DistanceMatrixService(); 
    var destination = new google.maps.LatLng(/* some lat/lng */); 
    var dfd = $.Deferred(); 
    service.getDistanceMatrix({ 
     origins: [position], 
     destinations: [destination], 
     travelMode: google.maps.TravelMode.DRIVING, 
     unitSystem: google.maps.UnitSystem.METRIC, 
     avoidHighways: false, 
     avoidTolls: false 
    }, function(response, status) { 
     if (status == google.maps.DistanceMatrixStatus.OK) 
      dfd.resolve(response); 
     else 
      dfd.reject(status); 
    }); 
    return dfd.promise(); 
} 

現在，你想要做

calculateDistance(…).then(function(response) { 
    var origins = response.originAddresses; 
    var destinations = response.destinationAddresses; 
    var results = response.rows[0].elements; 
    return results[0].distance.text + " (" + results[0].duration.text + " min)"; 
}).done(function(distanceMatrixResult) { 
    var myString = "distance is: "+distanceMatrixResult; 
    // do something with your string now 
});