関数呼び出しの間にパラメータ値を保存する方法は？

Question

天気アプリを作成して、AjaxリクエストをOpenWeatherMapに送信しようとしています。 w.getWeatherFuncでエラーが発生しました。関数sendRequestにw.weatherのパラメータを渡してから、次に呼び出す関数displayFuncに同じパラメータを渡しています。

キャッチされない例外TypeError：displayFuncで未定義 のプロパティを読み取ることができません '天気'（weather.js：46）weather.jsで ：78

ここ

は、私は、コンソールに持っているものです

これを修正して動作させるにはどうすればよいですか？

function Weather() { 
    var w = this; 

    var weatherUrl = 'http://api.openweathermap.org/data/2.5/weather?'; 
    var appid = '&appid=c0a7816b2acba9dbfb70977a1e537369'; 
    var googleUrl = 'https://maps.googleapis.com/maps/api/geocode/json?address='; 
    var googleKey = '&key=AIzaSyBHBjF5lDpw2tSXVJ6A1ra-RKT90ek5bvQ'; 

    w.demo = document.getElementById('demo'); 
    w.place = document.getElementById('place'); 
    w.description = document.getElementById('description'); 
    w.temp = document.getElementById('temp'); 
    w.humidity = document.getElementById('humidity'); 
    w.getWeather = document.getElementById('getWeather'); 
    w.addCityBtn = document.getElementById('addCity'); 
    w.rmCityBtn = document.getElementById('rmCity'); 
    w.icon = document.getElementById('icon'); 
    w.wind = document.getElementById('wind'); 
    w.time = document.getElementById('time'); 
    w.lat = null; 
    w.lon = null; 
    w.cityArray = []; 
    w.weather = null; 

    function sendRequest (url, data) { 

     var request = new XMLHttpRequest(); 
     request.open('GET', url, true); 
     request.send(); 

     request.onreadystatechange = function() { 
      if (request.readyState == 4 && request.status == 200) { 
        data = JSON.parse(request.responseText); 
        console.log(data); 
        return data; 
      } else { 
       console.log(request.status + ': ' + request.statusText); 
      } 
     } 

    } 

    function displayFunc (obj) { 

     console.log('obj ' + obj); 
     w.icon.src = 'http://openweathermap.org/img/w/' + obj.weather[0].icon + '.png'; 

     var timeNow = new Date(); 
     var hours = timeNow.getHours(); 
     var minutes = timeNow.getMinutes() < 10 ? '0' + timeNow.getMinutes() : timeNow.getMinutes(); 
     w.time.innerHTML = hours + ':' + minutes; 

     w.place.innerHTML = 'Place: ' + obj.name; 
     w.description.innerHTML = "Weather: " + obj.weather[0].description; 
     w.temp.innerHTML = "Temperature: " + w.convertToCels(obj.main.temp) + "°C"; 
     w.humidity.innerHTML = "Humidity: " + obj.main.humidity + '%'; 
     w.wind.innerHTML = 'Wind: ' + obj.wind.speed + ' meter/sec'; 
    } 


    w.convertToCels = function(temp) { 
     var tempC = Math.round(temp - 273.15); 
     return tempC; 
    } 


    w.getWeatherFunc = function() { 

     if (navigator.geolocation) { 
      navigator.geolocation.getCurrentPosition(function(location){ 
       w.lat = location.coords.latitude; 
       w.lon = location.coords.longitude; 

       var url = weatherUrl + 'lat=' + w.lat + '&lon=' + w.lon + appid; 

       var result = sendRequest(url, w.weather); 
       console.log(result);  
       displayFunc(result); 
      }); 
     } else { 
      alert('Browser could not find your current location'); 
     } 
    } 


    w.addCityBtn.onclick = function() { 
     var newCity = prompt('Please insert city', 'Kiev'); 

     var gUrl = googleUrl + newCity + googleKey; 
     var newCityWeather = null; 
     sendRequest(url, newCityWeather); 

     var location = newCityWeather.results[0].geometry.location; 
     var newUrl = weatherUrl + 'lat=' + location.lat + '&lon=' + location.lng + appid; 

     sendRequest(newUrl, w.weather); 

      displayFunc(newCity); 
      w.cityArray.push(newCity); 
     } 

    window.onload = w.getWeatherFunc; 

    setInterval(function() { 
     w.getWeatherFunc(); 
    }, 900000); 

} 

Answer 1

あなたのajax 返信は、ブラウザエンジンに戻ります。その非同期として、あなたはコールバックを作成する必要があります。この

sendRequest("yoururl",data,function(data){ 
displayFunc(data); 
}); 

Answer 2

初めてobjを関数に渡すと、1つ上のスコープが保存されます。その後、あなたがいなくても、以前に保存したオブジェクトを使用することになります。

var objBkp; 
function displayFunc (obj) { 
    if(undefined === obj) obj = objBkp; 
    else objBkp = obj; 
    // rest of code here 
} 

Answer 3

sendRequestでは、参照ではなくw.weatherの値だけを渡しています。 JavaScriptは値渡しまたは参照渡しではなく、sharingによって変数を渡します。だから、あなたはあなたの変数に値を与えたい場合は、あなたの機能sendRequest内でこれを行う必要があります：あなたは、属性を使用している場合

request.onreadystatechange = function() { 
    if (request.readyState == 4 && request.status == 200) { 
     w.weather = JSON.parse(request.responseText); 
     console.log(data); 
     return data; 
    } else { 
     console.log(request.status + ': ' + request.statusText); 
    } 
} 

また、あなたが引数として関数に渡す必要はありません。あなたもget()と

Answer 4

getWeatherFuncでconsole.log(result);は、あなたが何を与えないset()を作成した場合、その事実のほかに、それは良いでしょうか？ 私が見る通り、問題はdisplayFuncで渡されたパラメータが定義されていないことです。