コールバックを介して変数を渡すことはできませんまた、私は約束を置くことはできません

Question

私はループを介してユーザーが入力した距離からこの距離をチェックするためにgoogles web apiを使用して、私のコードを介してid変数を渡して、私がアクセスできるようにする必要がある場所に渡し、私がapiから得た答えに応じて印刷できるようにします。

私のコードは次のようである：

checkDist(data) { 
    this.setState({ 
    searching: true, 
    }); 
    var self = this; 
    data.forEach(item => { 
    console.log('check'); 
    self.getDist(item.postcode, item.id); 
    }); 
} 

updateSearchResults(dist) { 
    var output = []; 
    var self = this; 
    console.log('Here we will search the db using user data for suitable jobs'); 
    console.log("distFromLoc in Update: " + this.state.distFromLoc); 
    window.setTimeout(function() { 
    self.setState({ 
     dataToShow: output, 
     searching: false, 
     current: 1, 
    }); 
    const dataLength = self.state.dataToShow.length 
    self.setState({ 
     amountOfJobs: dataLength 
    })}, 10000) 
    } 
getDist(dest, id){ 
    var self = this; 
    const wrappedCallback = (id) => (...args) => this.callback(...args); 
    var origin = this.state.location, 
    destination = dest, 
    service = new window.google.maps.DistanceMatrixService(); 

    service.getDistanceMatrix(
    { 
     origins: [origin], 
     destinations: [destination], 
     travelMode: window.google.maps.TravelMode.DRIVING, 
     avoidHighways: false, 
     avoidTolls: false, 
     unitSystem: window.google.maps.UnitSystem.IMPERIAL 
    }, 
    wrappedCallback, 
); 
} 

callback(response, status, id) { 
    const self = this; 
    console.log("id in callback: " + id); 
    if(status === "OK") { 
    console.log(response); 
    var dest = response.destinationAddresses[0]; 
    if (response.rows[0].elements[0].status === "ZERO_RESULTS"){ 

     } else if (response.rows[0].elements[0].status === "OK"){ 
     var dist = response.rows[0].elements[0].distance.text; 
     this.setState({ 
      distFromLoc: dist 
     }, function() { 
      self.updateSearchResults(dist); 
     }) 
     } 
    } else { 
     alert("Error: " + status); 
    } 
    } 

IDはconst wrappedCallback = (id) => (...args) => this.callback(...args);からconst wrappedCallback = (...args) => this.callback(...args);を変更することにより、最終関数に渡されますが、それはもはや応答やステータスをログコンソールはありませんので、これは、最終的な機能を破りますconstが最初の方法であったが、最初の方法はidが何であるかを知らないときに行ったことです。

ID、レスポンス、ステータスがすべて意味するものをすべて知ってもらう方法はありますか？

Answer 1

別の関数に余分な変数を渡すことは、かなり単純なパターンで行うことができます。

は、あなたが名前に

const hi = (name) => console.log(`hi ${name}`); 

をHIと言う機能があり、

setTimeout(hi, 1000); 

まあ、明らかに名前を渡すことができない機能を受け入れるのsetTimeoutにこの機能を渡したいと言います今度はidの場合と同じですが、その関数をラップすると、無名関数を渡してより多くの引数を渡すことができます。次のような長いidはこの宣言時にスコープ内にあるよう

(response, status) => callback(response, status, id) 

としてcallbackにお電話をラップすることができます同じように

setTimeout(() => hi('bill'), 1000); 

。 フル機能の変更は、次のようになります。

getDist(dest, id){ 
    var self = this; 
    var origin = this.state.location, 
    destination = dest, 
    service = new window.google.maps.DistanceMatrixService(); 

    service.getDistanceMatrix(
    { 
     origins: [origin], 
     destinations: [destination], 
     travelMode: window.google.maps.TravelMode.DRIVING, 
     avoidHighways: false, 
     avoidTolls: false, 
     unitSystem: window.google.maps.UnitSystem.IMPERIAL 
    }, 
    (response, status) => callback(response, status, id), 
); 
}